我有几个选项卡,从数据库中填充。每个选项卡包含一个部分视图,也是从数据库中填充的。当有人向这些部分表示的集合中添加内容时,我希望它刷新选项卡内容,以反映更改。
function addNewRequest(arForm) {
username = $(".ui-tabs-selected").attr("id");
currentUser = document.getElementById("currUser").value;
$.ajax({
url: 'Home/submitAdvisoryRequestForm',
type: 'POST',
data: arForm.serialize() + "&username=" + username + "&currUser=" + currentUser,
success: function (response) {
if (response == "true") {
$("#users").tabs("load", $('#users .ui-tabs-panel:not(.ui-tabs-hide)').index() - 1);
dialog.dialog("close");
} else {
alert(response);
}
},
error: function (xhr, ajaxOptions, thrownError) { alert(xhr.status); alert(thrownError); }
});
}
因此,根据我的理解,如果ajax调用成功,它将尝试在当前选择的索引处加载选项卡。我观察了用于获取选定选项卡索引的表达式,据我所知,它是有效的,即使可能有点粗糙。
应该刷新选项卡的代码$("#users").tabs("load", $('#users .ui-tabs-panel:not(.ui-tabs-hide)').index() - 1);
什么也不做。有人知道为什么吗?
他妈的,我明白了。因为JQueryUI很蹩脚,只允许刷新AJAX加载的内容,所以只替换当前选定选项卡的div的HTML更容易。
JQuery代码:function addNewRequest(arForm) {
username = $(".ui-tabs-selected").attr("id");
currentUser = document.getElementById("currUser").value;
$.ajax({
url: 'Home/submitAdvisoryRequestForm',
type: 'POST',
data: arForm.serialize() + "&username=" + username + "&currUser=" + currentUser,
success: function (response) {
if (response) {
$('#users .ui-tabs-panel:not(.ui-tabs-hide)').html(response);
dialog.dialog("close");
} else {
alert(response);
}
},
error: function (xhr, ajaxOptions, thrownError) { alert(xhr.status); alert(thrownError); }
});
}
作为响应,将部分视图扔向它。
public ActionResult submitAdvisoryRequestForm(BCRTAdvisoryRequest newRequest, string username, string currUser)
{
if (ModelState.IsValid)
{
var ar = new AdvisoryRequestsLogic();
if (ar.addAdvisoryRequest(newRequest) > 0)
return PartialView("_userAdvisoryRequests", ar.getUserAdvisoryRequests(username));
}
return null;
}