Question

包含三个选项卡（jquery ui选项卡）的模式对话框，仅在第一次显示这三个选项卡。

这是包含选项卡的视图代码，并在对话框中加载：

<%@Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

     <script type="text/javascript">
      $(document).ready(function () {
        $("#tabstest").tabs();

      });

    </script>

 </asp:Content>


<asp:Content ID="Content3" ContentPlaceHolderID="MainContent" runat="server">

   <h2>jQuery Tabs Example</h2>

  <div>
    <div id="tabstest">
    <ul>
        <li><a href="#tabs-1">Home</a></li>
        <li><a href="#tabs-2">Products</a></li>
        <li><a href="#tabs-3">Contact Us</a></li>
    </ul>
    <div id="tabs-1">


    <p> this is the home page </p>
        <%--<% Html.RenderPartial("GetHomeTab");  %>    --%>        
    </div>
    <div id="tabs-2">
     <p> this is the Products page </p>
      <%--  <% Html.RenderPartial("GetProductTab");  %> --%>        
    </div>
    <div id="tabs-3">

    <p> this is the contact us  page </p>
       <%-- <% Html.RenderPartial("GetContactUsTab");  %>   --%>        
    </div>
</div>    
</div>

</asp:Content>

当我关闭对话框并重新打开它时，选项卡显示为链接，并且三个选项卡中的每个选项卡都会在点击时加载的部分视图显示在同一个稀释框中，但是当我刷新主页面时然后单击并打开对话框（第一次）选项卡可以分别正常加载其partialivews。

对话框的Jquery是：

jQuery(document).ready(function () {
  $('.trigger').live('click', function (event) {
            var dialogBox = $('<div></div>');
            $(dialogBox).dialog({
                autoOpen: false,
                resizable: true,
                title: 'Test Modal Dialog',
                modal: true,
                width: 'auto',
                open: function (event, ui) {
                    $(this).load('<%=Url.Action("TabExample2","Controller")%>');

                },
               close: function(event,ui){

                                           }

                             });

            $(dialogBox).dialog('open');


        return false;
    });

模态对话

之前遇到过这样的问题？我非常感谢你的见解。

由于

Answer 1

好的，我在这里注意到了几件事......

var dialogBox = $('<div></div>');
$(dialogBox).dialog({

无需在对话框周围$()。它已经是一个jquery对象了！这可能不是问题，但肯定没有帮助。：）

下：
尝试将关闭功能更改为：

close: function(event,ui){
    dialogBox.empty().dialog('destroy');    //basically what this does is empty it, and remove any dialog functionality from the div.
}

您可能还希望将标签初始化移至加载成功处理程序。我发现有时使用加载时文档不会按预期触发。

 open: function (event, ui) {
           $(this).load('<%=Url.Action("TabExample2","Controller")%>', function(){
               $("#tabstest").tabs();
           });

 },

这应该很好地解决它：）

mvc对话框第二次不显示选项卡

1 个答案: