jQuery UI的對話框不會關閉

考慮下面的腳本：jQuery UI的對話框不會關閉

$(function() { 
    $(".editLink").button(); 

    $('#editPersonDialog').dialog({ 
     autoOpen: false, 
     width: 800, 
     resizable: false, 
     title: 'Edit Person', 
     modal: true, 
     buttons: { 
      "Save": function() { 
       $("#update-message").html(''); 
       $("#updatePersonForm").submit(); 
      }, 
      "Close": function() { 
       $(this).dialog('close'); 
      } 
     }, 
     close: function (event, ui) { 
      $(this).dialog('close'); 
     } 
    }); 

    $(".editLink").click(function() { 
     var dialogDiv = $('#editPersonDialog'); 
     var linkObj = $(this); 
     var viewUrl = linkObj.attr('href'); 
     $.get(viewUrl, function (data) { 
      dialogDiv.html(data); 
      //validation 
      var $form = $("#updatePersonForm"); 
      // unbind existing validation 
      $form.unbind(); 
      $form.data("validator", null); 
      // check document for changes 
      $.validator.unobtrusive.parse(document); 
      // re-add validation with changes 
      $form.validate($form.data("unobtrusiveValidation").options); 
      // open dialog 
      dialogDiv.dialog('open'); 
     }); 

     return false; 
    }); 
}); 

function updateSuccess() { 
    if ($("#update-message").html() == "True") { 
     $('#editPersonDialog').dialog('close'); 
     $("#commonMessage").html("Update Complete"); 
     $("#commonMessage").delay(400).slideDown(400).delay(3000).slideUp(400); 
    } 
    else { 
     $("#update-message").show(); 
    } 
}

如果單擊窗體關閉精細對話框中的「X」按鈕。如果我點擊「關閉」按鈕，它不會關閉。我已經驗證了「關閉」按鈕的代碼正在被調用。

「X」按鈕和「關閉」按鈕都運行相同的語句：'$（this）.dialog（'close'）;'。爲什麼一個工作，另一個不工作？

除非我刷新頁面，否則對話框將不會再次打開。我想這兩個問題可能是相關的。

我發現許多人有類似的問題和一些不同的解決方案，爲他們工作。不幸的是他們都沒有爲我工作。

另外的信息：

該對話框顯示在Ajax形式的局部視圖：

@using (Ajax.BeginForm("Edit", "Person", null, 
    new AjaxOptions 
    { 
     UpdateTargetId = "update-message", 
     InsertionMode = InsertionMode.Replace, 
     HttpMethod = "POST", 
     OnSuccess = "updateSuccess" 
    }, 
    new { @id = "updatePersonForm" })) 
{ 
    @Html.ValidationSummary(true) 
    <div id="update-message" class="hiddenDiv"></div> 
    <div class="blockGraygradient"> 
     @Html.Partial("_CreateEditCommon") 
     @Html.HiddenFor(model => model.SelectedPerson.Id) 
     @Html.HiddenFor(model => model.SelectedPerson.RowVersion) 
     @Html.HiddenFor(model => model.SelectedPerson.CreateTime) 
    </div><p/> 
}

來源

2012-01-16 daveywc

我發現的這兩個問題的原因（關閉按鈕沒有工作，暫時無法顯示對話框不止一次而無需刷新頁面）是我已經在我的主頁面中包含了對腳本文件的引用，並且在對話框中顯示了部分視圖。一旦我從部分視圖中刪除腳本引用，問題就消失了。我們認爲這是我將腳本放在部分視圖中的原因，因爲我們已經提出了另一個問題，在關閉對話框時將Ajax更新回到主頁面上。）。

來源

2012-01-16 23:32:41 daveywc

我發現附加文章中提供的方法幫助我使jQuery UI對話框運行良好：http://www.codeproject.com/KB/ajax/jQuery-Modal-Dialogs.aspx。 – daveywc 2012-01-18 22:22:53

嘗試使用此來代替。

$(this).dialog('destroy');

我們有完全相同的問題。最後，每當你重新打開對話框時，它實際上是重新將對話框標記注入到DOM中。然後，當您單擊關閉（第二次）時，它只會關閉對話框的第一次出現，但不一定是已打開的對話框。您可以使用FireBug或Chrome的內置開發人員工具等運行時DOM檢查器來檢查此問題。

來源

2012-01-16 12:13:52 tobias86

我已經試過調用'destroy'和'remove'沒有任何成功。 – daveywc 2012-01-16 20:13:13

你有太多的遞歸。您不需要訂閱jQuery對話框的close事件並在其中調用$(this).dialog('close');。簡評該行或完全刪除close事件訂閱：

$('#editPersonDialog').dialog({ 
    autoOpen: false, 
    width: 800, 
    resizable: false, 
    title: 'Edit Person', 
    modal: true, 
    buttons: { 
     "Save": function() { 
      $("#update-message").html(''); 
      $("#updatePersonForm").submit(); 
     }, 
     "Close": function() { 
      $(this).dialog('close'); 
     } 
    } 
});

來源

2012-01-16 12:15:00

訂閱關閉事件之前，我遇到了同樣的問題。我只訂閱了關閉事件來測試'close'的調用是否會在那裏運行。 – daveywc 2012-01-16 20:12:09

jQuery UI的對話框不會關閉

回答

相關問題