Лучший способ временно отключить отправку ajax на плагин ajaxForm

Question

Я использую jQuery malsup ajaxForm plugin на форме. У меня есть куча POST-варов, которые отправляются, и это работает нормально, я хочу использовать одни и те же пост-вары для выполнения опции «Экспорт в файл». Это означает использование одной и той же формы для обоих типов отправки.

Поскольку вы не можете загружать файлы через представление AJAX, я использую .unbind('submit').submit() в форме, чтобы предотвратить запуск ранее назначенных обработчиков событий ajax.

После этого разворота возникает необходимость повторного запуска конструктора ajaxForm, когда пользователь хочет изменить фильтры с помощью AJAX (а не для экспорта).

Прежде чем я приложу больше времени на исправление краевых дел и пару ошибок, я подумал, есть ли более чистый способ сделать это?

Answer 1

Использование специальных мероприятий и trigger()!

Во-первых, поставьте переключатель в своей форме, чтобы пользователь мог переключаться между AJAX/Экспортировать в файл. Предположим, что имя этого поля: submitAction

Во-вторых, ваш слушатель будет действовать только для того, чтобы решить, что произойдет дальше, исходя из значения радиостанции submitAction. Здесь вы стреляете пользовательские события (мы определяем их в шаге 3):

$('form.specialform').on('submit',function(e){ 
    e.preventDefault(); 
    var checked = $(this).closest('[name="submitAction"]').filter(':checked'); 
    if(checked.val() == 'ajax'){ //ajax! 
     $(this).trigger('submitAJAX'); 
    } else { //export to file! 
     $(this).trigger('submitExport'); 
    } 
}); 

В-третьих, определить свои собственные события с двумя слушателями событий:

$('form.specialform').on('submitAJAX',function(e){ 
    //do AJAX call here 
}); 

$('form.specialform').on('submitExport',function(e){ 
    //do file export here 
}); 

Как вы можете видеть, это делать это способ позволяет избежать беспорядка несвязывания и повторного связывания тех же обработчиков событий несколько раз.

Помогло ли это?

Answer 2

Большое спасибо Джонатану за вышеуказанный ответ. Мы тоже столкнулись с подобной проблемой, и запуск пользовательских событий помог нам. Также я бы добавил, что если используется malsup ajaxForm plugin, мы должны вызывать 'ajaxSubmit' вместо ajaxForm, поскольку ajaxForm не отправляет форму.

$('form.specialForm').on('submitAJAX',function(e) { 
     $(this).ajaxSubmit({ 
      target: '#query_output', 
      beforeSubmit: showLoading, 
      success:  hideLoading 
     }); 
    });