Отправить при изменении шага в шагах jQuery

Вот кусок кода, который у меня есть:

    $("#test-wizard").steps({
        headerTag: 'header',
        bodyTag: '.container',
        transitionEffect: "slideLeft",
        autoFocus: true,
        onStepChanged: function(event, currentIndex) {
            $('#skills-form').submit();
            return true;
        }
    });

Итак, как вы видите, я использую jQuery Steps для создания многошаговой формы. На каждом этапе я хотел бы отправлять результаты (значения) на внутренний сервер. Для этого я использую submit(), но он перезагружает страницу, что означает, что он не перейдет к следующему шагу формы. Что мне нужно, так это отправлять форму на каждом этапе, но не допускать обновления всей страницы, из-за чего форма возвращается к первому шагу. Конечно, я попытался использовать event.preventDefault() для функции отправки, но затем он также заблокировал запрос к серверной части (но мне нужно только заблокировать обновление страницы).


javascript jquery jquery-steps
person Murakami    schedule 23.10.2018    source источник
comment
вам нужен ajax, если вы хотите, чтобы страница не обновлялась   -  person madalinivascu    schedule 23.10.2018

Ответы (1)


arrow_upward
3
arrow_downward

Вместо отправки формы вы можете сериализовать ее и отправить данные с помощью AJAX.

$("#test-wizard").steps({
  headerTag: 'header',
  bodyTag: '.container',
  transitionEffect: "slideLeft",
  autoFocus: true,
  onStepChanged: function(event, currentIndex) {
    var formData = $('#skills-form').serialize(); // Gets the data from the form fields
    $.post('path_to/form_handler_file', formData)
  }
});
person Nedko Dimitrov    schedule 23.10.2018