2011-07-11 45 views
1

包含三個選項卡(jquery ui選項卡)的模式對話框僅在第一次顯示這三個選項卡。mvc對話框第二次不顯示選項卡

這是包含突出部和加載在對話框內的視圖的代碼:

<%@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> 

當我關閉對話框,並重新打開它的選項卡顯示的鏈接,以及三個標籤中的每一個都假設在點擊時加載的部分視圖都顯示在同一個dilog框中,但是當我刷新主頁並單擊並打開對話框(第一次)時,標籤可以正常加載他們的偏好分別。

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; 
    }); 

模態對話框

與之前這樣的問題的經驗嗎?我將非常感謝你的洞察力。

感謝

+0

我們可以看到,用於創建和打開你的對話框jquery的? – Patricia

回答

2

確定幾件事情我已經在這裏發現...

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(); 
      }); 

}, 

這應該很好地解決這個問題了:)

+0

我非常感謝你,爲你提供準確的解決方案。 – Sue

+2

很高興我能幫忙:) – Patricia

相關問題