Question

我在项目中创建了一个模态对话框，我可以在模态对话框中加载部分视图/视图，问题在视图上我有3个选项卡，每个选项卡都引用另一个部分视图。当我单击选项卡时，它会在父页面（具有模态对话框链接的页面）中显示相关的部分视图，而不是仅仅在模态对话框内移动选项卡。以前有人遇到过这个问题吗？

我将不胜感激任何帮助或类似的例子。

这是我的代码 jQuery（document）.ready（function（）{

        $('.trigger').live('click', function (event)
         { 
              var id = $(this).attr('rel');    
                 var dialogBox = $("<div>");
                       $(dialogBox).dialog({   
                               autoOpen: false,
                               resizable: true,
                               title: 'Test Modal Dialog',
                               modal: true,
                               show: "blind",
                               hide: "blind", 
                               open: function (event, ui) {

                                         $(this).load('<%=Url.Action("action1","controllerName")%>');
                                                                           } 



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

然后我有4个部分视图，第一个是action1：

    <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<NeboAlertManagement.Models.model>" %>

“type =”text / javascript“＆gt; “type =”text / javascript“＆gt; “type =”text / javascript“＆gt; “type =”text / javascript“＆gt;

        <div id="tabContainer">
         <ul id="menu"> 


          <li><%= Html.ActionLink("Home", "action2", "controllername")%></li>
          <li><%= Html.ActionLink("Products", "action3", "controllername")%></li>
          <li><%= Html.ActionLink("Contact Us", "action4", "controllername")%></li>


      <%--    <li><%= Html.RenderPartial("action2")%></li>
          <li><%= Html.RenderPartial("action3")%></li>
          <li><%= Html.RenderPartial( "action4")%></li>--%>


        </ul>
        </div>
        <% } %>

，其他三个部分视图是简单的测试视图，但如果有帮助我可以发布它们！

谢谢！

Answer 1

您应该为链接提供一个“触发器”类 - 标签，以便jquery live可以捕获它们。

Html.ActionLink("Text", "Action", new { controller = "Home" }, new { @class = "trigger" })

并在点击处理程序的顶部使用

 $('.trigger').live('click', function (event)
 { 
     event.preventDefault()
     var uriToLoad = $(this).attr('href');

在将值加载到弹出窗口之前 - 请确保使用相同的弹出窗口。因为现在你每次都会创建新的弹出窗口。所以：

// popup already present
if($('#mypopupid').length > 0 && $('#mypopupid').dialog("isOpen")) {
    $('#mypopupid').load(uriToLoad);
} else { // rest of the code - give popup id
  var dialogBox = $('<div id="mypopupid" />')
}

如果弹出窗口已经存在，请使用它，如果没有打开新的话。

带选项卡的mvc3模式对话框

1 个答案: