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加载部分视图

回答

相关问题