中止AJAX和表單子表單，保存它們，更改它們並稍後發送

Question

我需要向用戶請求額外的憑據，當他單擊某些按鈕並提交某些表單時。

我的方式，我試圖做到這一點是：

• 攔截提交事件，放棄它，並保存副本
• 詢問憑據與提示對話框（不是JS原生一個，所以這都是非阻塞的）
• 如果用戶輸入憑證，請將字段插入事件數據並將其發送到服務器。

我對AJAX請求當前的代碼：

$(document).ajaxSend(function(event, jqXHR, ajaxOptions) { 
    if (ajaxOptions.type === "POST") { 
    $.current_request = jqXHR; 
    jqXHR.abort(); 
    $.check_password_with_my_dialog(); 
    } 
}); 

$.check_password_with_my_dialog: function() { 
    $("#validate-password-prompt").dialog({ 
    modal: true, 
    title: "input pw", 
    buttons: { 
     Ok: function() { 
     $.password = $("#validate-password-prompt input").val(); 
     $.deliver_current_request(); 
     return $(this).dialog("close"); 
     }, 
     Cancel: function() { 
     return $(this).dialog("close"); 
     } 
    } 
    }); 
} 

deliver_current_request: function() { 
    $.current_request.beforeSend = function(jqXHR, ajaxOptions) { 
    ajaxOptions.data = ajaxOptions.data.concat("&password=" + $.password); 
    }; 
    $.ajax($.current_request); 
} 

問題至今是ajaxOptions.data是不確定的，所以我不能添加我的數據。 而這些請求似乎是作爲GET而不是POST。

我是以正確的方式做，還是我的方式？

Answer 1

更新

這裏是一個辦法，我能想到的完成回答你的問題。

<form id="myForm" > 
    <button id="submit-form-btn">Submit</button> 
</form> 
<div id="validate-admin-password-prompt"> 
    <input type="password"/> 
</div> 

在JavaScript中，

function submitForm(pwd) { 
    var formData = $('form#myForm').serialize() + "&password=" + pwd; 
    $.ajax({ 
     type: "POST", 
     url: "http://google.com", 
     data: formData, 
     dataType: "script" 
    }); 
    alert("POSTed: " + formData.toString()); 
} 

function alertDialog() { 
    $("#validate-admin-password-prompt").dialog({ 
    modal: true, 
    title: "Admin password is required", 
    zIndex: 10000, 
    buttons: { 
     Ok: function() { 
     $(this).dialog("close"); 
     var pwd = $("#validate-admin-password-prompt input").val(); 
     submitForm(pwd); 
     }, 
     Cancel: function() { 
     $(this).dialog("close"); 
     alert('Not authorized to submit the form'); 
     return false; 
     } 
    } 
    }); 
} 
$("#submit-form-btn").click(function(e) { 
    e.preventDefault(); 
    $ele = $("#validate-admin-password-prompt input");  
    if ($ele.val()==null || $ele.val().trim()=="") { 
     alertDialog(); 
    } else { 
     submitForm($ele.val()); 
    } 
});