Asp.Net MVC, JQuery UI sekmesinden ajax kullanarak kısmi görünüm yükleme

Question

Denetleyicimde kısmi görünüm (ascx) döndüren birkaç eylem yöntemim var ve bu kısmi görünümlerin farklı JQuery'ye tıklandığında görüntülenmesini istiyorum UI sekmeleri.

sekmeleri böyle tanımlanmıştır:

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

Bu (statik içerikli) ilk sekme doğru görüntülenir, sekmeler iyi görüntüleniyor, ancak diğer sekmeleri tıkladığımda hiçbir şey olmuyor.

Eylem yöntemlerinden kısmi bir görünüm döndürmek yerine, yalnızca düz içeriği döndüğümde, içeriği gayet güzel bir şekilde işler ve sekmeler mükemmel çalışır.

Neyi yanlış yaptığım hakkında bir fikrim var mı?

Teşekkür

Answer 1

Hey, son zamanlarda aynı şeyi yaptık. Daha açık olmak üzere basitleştirilmiş:

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> 

ve JQuery kodu:

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