我的控制器上有几个动作方法返回部分视图(ascx),我希望在单击不同的
JQuery UI选项卡时呈现这些部分视图.
选项卡的定义如下：
<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>
这样可以很好地显示选项卡,第一个选项卡(带有静态内容)可以正确显示,但是当我单击其他选项卡时,没有任何反应.
如果不是从动作方法返回局部视图而是返回普通内容,它会使内容呈现正常,并且标签可以完美地运行.
我知道我做错了什么吗？
谢谢
解决方法
嘿,我最近做了同样的事情.我简化了以便更清楚：
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);
}
});
}
