Почему submit не работает в моем скрипте jquery?

Мой html и скрипт выглядит следующим образом. Он использует Django и это шаблон Django, но я думаю, что это проблема, не связанная с Django. Он отображает список dir или файлов (если есть), которые расположены в элементах ul и li. Когда я нажимаю на любой элемент списка (элемент li), я ожидаю, что это вызовет отправку. Я вижу окно alert(), но не вижу запроса на отправку со стороны сервера. У меня есть похожий сниппет в другом месте моего проекта, и он работает, а этот нет. Я не могу понять, что я упустил?

<form id="id_f_sel" action="{% url 'integratedTest:addCase' %}" method="post">
        {% csrf_token %}
        <input type="hidden" id="id_f_clked" name="f_clked" value="">
            <ul id="id_dirlist">
                {%for item in dirs %}
                    <li><img src="{% static 'image/folder.png' %}" alt="unclicked folder image">
                    <span class="caret">{{item}}</span></li>
                {%endfor%}
            </ul>
        
            <ul id="id_flist">
                {%for item in files %}
                    <li><img src="{% static 'image/file.png' %}" alt="file image">
                    <span class="caret">{{item}}</span></li>
                {%endfor%}
            </ul>            
        </form>

<script>  
    $(document).ready(function() {    
        $('li').on('click', function() { 
          clk_val = $(this).text()  
          alert(clk_val)
          $('#id_f_clked').val(clk_val)  
          $('#id_f_sel').submit()          
        });
    });
</script>

Вернуться на верх