JQuery確認對話框後按下提交按鈕，但在發佈之前使用.ajax（）

Question

我有一個非常簡單的場景，我想使用JQuery的ajax（）方法張貼表單，但在實際執行之前執行請求一些來自用戶的確認帖子。

我有一個JQuery UI對話框，並帶有本地化按鈕，以防萬一您想知道下面所有按鈕的代碼是關於什麼的。

這是我到目前爲止的代碼：

var i18n_deleteButtons = {}; 

i18n_deleteButtons[i18n.dialogs_continue] = function() { 
    return true; 
    $(this).dialog('close'); 
}; 

i18n_deleteButtons[i18n.dialogs_cancel] = function() { 
    return false; 
    $(this).dialog('close'); 
}; 

$('#delete-dialog').dialog({ 
    open: function() { 
     $(this).parents('.ui-dialog-buttonpane button:eq(1)').focus(); 
    }, 
    autoOpen: false, 
    width: 400, 
    resizable: false, 
    modal: true, 
    buttons: i18n_deleteButtons 
}); 

$("form#form_attachments").submit(function (event) { 
    /* stop form from submitting normally */ 
    event.preventDefault(); 
    /* get some values from elements on the page: */ 
    var $form = $(this), url = $form.attr('action'); 

    // build array of IDs to delete (from checked rows) 
    var jdata = { 'attachmentIdsToDelete': [] }; 
    $('input:checked').each(function() { 
     jdata['attachmentIdsToDelete'].push($(this).val()); 
    }) 

    $.ajax({ 
     beforeSend: function (request) { 
      // Return false if you don't want the form submit. 
      $('#delete-dialog').dialog('open'); 
     }, 
     url: url, 
     type: "POST", 
     dataType: "json", 
     data: jdata, 
     traditional: true, 
     success: function (msg) { 
      $('#msg').html(msg); 
     } 
    }); 
}); 

對話實際上是打開了罰款，但在點擊任何按鈕的結果沒有發生的事情。帖子不會發生，無論點擊哪個按鈕，對話框都不會關閉。

我該如何做這項工作？

Answer 1

因爲默認的jQuery UI對話框有點繁瑣的常規使用和麻煩在一些自定義的情況下配置我環顧四周，發現這個簡單的確認插件是基於jquery UI默認的東西。它也允許非常簡單的國際化。

https://github.com/wiggin/jQuery-Easy-Confirm-Dialog-plugin

Answer 2

爲什麼在提交處理程序中移動實際的ajax調用並在刪除對話框中按下按鈕時觸發它？

您可以將ajax調用存儲在分離函數中，並將此函數和url作爲參數傳遞給確認例程。

[pseudo code] 

function callAjax() { 
    ... 
} 
function submitHandler() { 
    confirmDialog({callback:callAjax,param:you_url}); 
} 
function confirmDialog(obj) { 
    $('#yes_btn').click(function() { 
     // call the callback 
     obj.callback(obj.param); 
    }); 
    $('#no_btn').click(function() { 
     // just close the dialog 
    }); 
} 

這樣的confirmDialog不必瞭解Ajax調用任何東西，它只是用給定的參數，當用戶點擊OK執行回調。