如何在jQuery UI對話框中提交表單並顯示其響應

Question

嗨 我正在使用jQuery UI對話框並嘗試使用Ajax提交表單並顯示其響應。直到窗體對話框和ajax請求工作正常，但不知道如何在同一個對話框中顯示其響應。任何建議會幫助我。

Answer 1

我猜你打開你的對話是這樣的：

$.post('xyz.htm', function(data) { $('#mydialog .mytarget').html(data).slideDown(); }); 

訣竅是使用回調函數（如參數獲取響應），以及傾銷響應到您想要的元素。

Answer 2

假設你有下面的標記

<div id="__DialogPanel" style="display:none" title=""></div> 

有了這個代碼，你設置的對話框

$("#__DialogPanel").dialog({ 
    autoOpen: false, 
    resizable: false, 
    position: 'center', 
    stack: true, 
    height: 'auto', 
    width: 'auto', 
    modal: true 
}); 

有了這個代碼，您顯示對話框，包括Ajax調用的結果

$.ajax({ 
    type: "get", 
    dataType: "html", 
    url: 'some/url', 
    data: {}, 
    success: function(response) { 
     $("#__DialogPanel").empty().html(response).dialog('open'); 
    } 
}); 

使用此代碼，您可以在對話框中提交表單，然後在一切正常時關閉它或者如果有錯誤再次顯示錶格

$.ajax({ 
    type: 'post', 
    dataType: 'html', 
    url: '/someother/url', 
    async: false, 
    data: $("#myform").serialize(), 
    success: function (response, status, xml) { 
     //Check for error here 
     if (error) { 
      $("#myform").parent().html('').html(response); 
     } 
     else { 
      $("#__DialogPanel").dialog('close'); 
     } 
    } 
}); 

希望它有幫助！