Несколько запросов на получение одного действия - PullRequest
0 голосов
/ 23 декабря 2019

В настоящее время у меня есть приложение для напоминаний CRUD, и у меня есть контекстное меню с такими параметрами, как редактирование, удаление и т. Д. Кнопки в контекстном меню обновляются на основе идентификатора напоминаний, а идентификаторы передаются в модальную форму начальной загрузки . .

function toggleMenuOn(e) {
    if ( menuState !== 1 ) {
      menuState = 1;
      menu.classList.add( contextMenuActive );
    }

    let reminder_id = e.target.id
    let context_btn1 = document.getElementById("context_menu_btn1");
    let reminder_pk = reminder_id.replace("reminder", "");
    let reminder_url = "{% url 'update-reminder' 0 %}".replace(/0/, reminder_pk) 
    context_btn1.className = "update-reminder context-menu__link btn btn-light";
    context_btn1.setAttribute('data-id', reminder_url);
    $("#context_menu_btn1").modalForm({formURL: reminder_url});
  }

Однако, когда я посмотрел в командной строке, я увидел много запросов GET за одно нажатие кнопки:

[22/Dec/2019 17:50:01] "GET /update_reminder/8/ HTTP/1.1" 200 4650
[22/Dec/2019 17:50:01] "GET /update_reminder/4/ HTTP/1.1" 200 4681
[22/Dec/2019 17:50:01] "GET /update_reminder/8/ HTTP/1.1" 200 4650
[22/Dec/2019 17:50:01] "GET /update_reminder/4/ HTTP/1.1" 200 4681

Интересно то, что когда страницасначала загружается, и я нажимаю изменить на напоминании, появляется один запрос GET. Но когда я нажимаю на него в другой раз, появляются 2 запроса GET с чередующимися ссылками, как показано выше. После третьего редактирования нажмите 3 запроса GET. Я посмотрел на вкладке сети в элементе проверки и показывает то же самое. Это проблема, поскольку она замедляет страницу и иногда возвращает неверный URL-адрес формы. Я совершенно заблудился о том, как и почему это происходит, так как modalForm вызывается только один раз.

1 Ответ

0 голосов
/ 23 декабря 2019

Вы создаете новый modalForm каждый раз при переключении меню, поскольку вы помещаете его объявление в toggleMenuOn. Вместо этого вы должны объявить это один раз (при загрузке приложения), см. их README :

<script type="text/javascript">
$(document).ready(function() {

    $(".create-book").modalForm({
        formURL: "{% url 'create_book' %}"
    });

});
</script>
...