AJAX вызов функции представления Django не только один раз, но и для предыдущих попыток

У меня есть код, который должен удалить элемент списка.

        // Triggers when the item "element_to_click" is double clicked and calls the 
        // function named show_hide_function()

        $( element_to_click ).one('dblclick', function(e) {
          show_hide_function(input_mt_key, update_form_mt, input_mt, button_text, 
          csrfmiddlewaretoken)});
    
  
       // Creates a button to delete the selected item, then calls delete_function()
       
       function show_hide_function(input_key, form, input, button_text, csrf_token){
           const del_btn = document.createElement("button")
           del_btn.name="my_del_btn"
           form.appendChild(del_btn);
           const button_text_del = document.createTextNode("X")
           del_btn.appendChild(button_text_del)
           del_btn.setAttribute("class", "update_delete_buttons")
    
        // On click on del_btn, calls the function named delete_function()
        $( del_btn ).on('click', function(e) {
            delete_function(input_key,csrf_token)});
        };
    
   
       // Sends a form to backend (django) and on success, calls another function 
       // named jsonToDict() which I believe, is not part of the problem. So I don't 
       // include it here.
       function delete_function(input_key, csrf_token){
        $(document).on('submit' , function(e){
            e.preventDefault();
            
            $.ajax({
                type: 'POST',
                url: '/posted/delete/',
                data:{
                item_id:input_key.value,
                projectURL: projectURL_,
                csrfmiddlewaretoken:csrf_token,
                },
                success: function (data){
                    jsonToDict(data, "update_delete_form")
                }; 
              });
            });
           };

Упрощенная версия моей функции представления django выглядит следующим образом:

def deleteDictionary(request):
   print("called")
   if request.method == 'POST':
       var2 = request.POST['item_id']
       projectURL = request.POST['projectURL']
       value_holder = Task.objects.filter(taskID=var2).values_list('taskIdentifier')
   else:
       pass

Вот как выглядят мои предметы

Вот как они выглядят при двойном щелчке:

Когда я удаляю первый элемент, я не получаю никакой ошибки. Когда я делаю то же самое для второго элемента (не обновляя страницу), он также удаляется, но я получаю следующую ошибку на frontend:

Я возвращаюсь на сервер и проверяю, что происходит, я вижу, что при нажатии на кнопку удаления второго элемента, функция view вызывается дважды (функция печатает "called" дважды.) и, естественно, это создает проблему для остальной части кода, которую я не включил сюда, так как я думаю, что проблема не в этом (ввод, предоставленный формой, должен быть добавлен в список, а затем этот список обрабатывается. Поскольку функция вызывается дважды, она создает пустой список, и функция выдает ошибку). Более того, когда я обновляю страницу и удаляю 3 элемента, эта ошибка возникает дважды (первый вызов работает нормально, второй и третий вызывают ошибку, то есть функция django view вызывается 2 раза и 3 раза соответственно). Я думаю, вы поняли идею. Итак, каким-то образом AJAX вызывает мою функцию представления django n раз, где n - номер элемента, который я пытаюсь удалить, даже если я нажимаю на кнопку удаления разных элементов...

В прошлом у меня не было этих слушателей событий и функций. У меня была форма AJAX без функции, и она прекрасно работала. Теперь, когда я хочу, чтобы она работала для каждого элемента отдельно, она выдает эту ошибку.

Что я пробовал до сих пор: Я проверил, вызывается ли функция delete_function() дважды, когда я нажимаю на кнопку удаления второго элемента. Ответ - НЕТ. Все, что вы видите в JS-коде выше, вызывается только один раз. Но каким-то образом AJAX запоминает предыдущие попытки и вызывает функцию django view и для этих попыток.

Я хотел бы подчеркнуть, что функция просмотра работает нормально. Если я попытаюсь удалить 5 элементов, то все 5 элементов будут удалены независимо от того, создаст функция ошибку или нет. Но поскольку функция вызывается несколько раз без необходимости, это значительно замедляет мой код.

Короткая версия моего вопроса: как я могу избежать AJAX для отправки формы для предыдущих попыток.

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