Asp.Net MVC從JQuery UI選項卡使用ajax加載部分視圖

我的控制器上有幾個操作方法返回一個部分視圖（ascx），我希望在單擊不同的JQuery時呈現這些部分視圖UI標籤。Asp.Net MVC從JQuery UI選項卡使用ajax加載部分視圖

的選項卡定義是這樣的：

<div id="tabs"> 
    <li><a href="#FirstTab" title="First tab">First tab</a></li> 
    <li><%= Html.ActionLink("General", "General", new {id=Model.Id}) %></li> 
    <li><%= Html.ActionLink("Details", "Details", new {id=Model.Id}) %></li> 
    <div id="FirstTab"> 
    ... 
    </div> 
</div>

這使得標籤罰款，第一個選項卡（靜態內容）顯示正常，但是當我點擊其他選項卡，沒有任何反應。

如果不是從操作方法返回一個局部視圖，我只是返回純文本內容，而是渲染內容就好了，這些選項卡完美地工作。

任何想法我做錯了什麼？

謝謝

來源

2009-10-29 willvv

到目前爲止，一切看起來不錯。你能檢查ajax調用是否實際發生？如果它正在發生，那麼從行動中返回的是什麼？您可以使用FireBug等工具輕鬆檢查。 – 2009-10-29 15:10:06

嗨，約翰尼，是的，電話正在發生（我把行動中的斷點，他們被擊中）。我使用aspx頁面而不是ascx解決了這個問題（aspx頁面沒有html，head或body標籤，只是我想渲染的控件）。這看起來很奇怪，或者也許是我沒有清楚的看法和PartialView之間的區別 – willvv 2009-10-29 16:48:46

我很高興你能找到一個工作解決方案。 – 2009-10-30 03:58:28

嘿，我最近做了同樣的事情。我爲了簡化，更加明確：

的HTML：

<div class="tabs"> 
       <ul> 
        <li> 
         <a onclick="TabItemClicked(this,<%=Url.Action("General", new {id=Model.Id}) %>))" href="#fragment1"> 
         <span>General</span> 
         </a> 
        </li> 
        <li> 
         <a onclick="TabItemClicked(this,<%= Html.ActionLink("Details", new {id=Model.Id}) %>))" href="#fragment2"> 
         <span>Details</span> 
         </a> 
        </li> 
       </ul> 
       <div id="fragment1"></div> 
       <div id="fragment2"></div> 
    </div>

和jQuery代碼：

function TabItemClicked(a, action) { 

    var container = $(a).parents('div.tabs'); 
    var resultDiv = $($(a).attr('href'), container); 

    $.ajax({ 
     type: "POST", 
     url: action, 
     data: {}, 
     success: function(response) { 
      resultDiv.html(''); 
      resultDiv.html(response); 
     } 
    }); 
}

來源

2009-10-29 16:07:46

謝謝，我知道這會工作，但我試圖用JQuery UI選項卡的默認功能來實現它... – willvv 2009-10-29 16:49:59

哦，好的。恩，謝謝接受:) – 2009-10-29 17:08:46

Asp.Net MVC從JQuery UI選項卡使用ajax加載部分視圖

回答

相關問題