暫時禁用ajaxForm插件提交的更好方法

我在表單上使用jQuery malsup ajaxForm plugin。我有一堆POST變量被提交併且工作正常，我想使用相同的後置變量來執行導出到文件選項。這意味着對兩種提交類型使用相同的表單。暫時禁用ajaxForm插件提交的更好方法

因爲無法通過AJAX提交下載文件，所以我在表單上使用.unbind('submit').submit()來防止先前分配的ajax事件處理程序被觸發。

發生這種解除綁定後，我必須重新運行ajaxForm構造函數，當用戶想要使用AJAX（不適用於導出）更改過濾器。

在我花更多時間修復邊緣案例和一些bug之前，我想知道是否有更簡潔的方法來做到這一點？

來源

2012-01-25 Tr1stan

夥計，你是我的英雄 - 我花了2個小時拉我的頭髮試圖找出如何'解開'那個愚蠢的（好吧，不是真的）ajaxForm。你有沒有找到一個更好的方式來做到這一點？ – techexpert

使用自定義事件和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 
});

正如你所看到的，做這個這種方式可以避免一連串解綁和重新綁定相同事件處理程序的麻煩。

這有幫助嗎？

來源

2012-08-22 01:56:12

非常感謝喬納森對上述答案。我們也面臨類似的問題，觸發自定義事件爲我們製造了詭計。另外我會補充說，如果malsup ajaxForm plugin被使用，我們應該調用'ajaxSubmit'而不是ajaxForm，因爲ajaxForm不會提交表單。

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

來源

2014-02-28 06:44:08 pkr13

暫時禁用ajaxForm插件提交的更好方法

回答

相關問題