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的对话框不会关闭

回答

相关问题