我的项目中有一个视图,它有一个kendo下拉列表
@(Html.Kendo().DropDownListFor(m => m.database_pk)
.BindTo(Model.databases)
.Name("database_pk").OptionLabel("Select one...")
.DataValueField("Value")
.DataTextField("Text")
.HtmlAttributes(new { @id = "database_pk", onchange = "changeDatabase()" })
)
和一个剑道标签
@(Html.Kendo().TabStrip()
.Name("menu")
.Items(items =>
{
items.Add().Text("Database Info").LoadContentFrom("DatabaseInfo", "Home", new { database_pk = Model.database_pk }).Selected(true);
items.Add().Text("Tables").LoadContentFrom("TableInfo", "Table", new { database_pk = Model.database_pk }).Selected(true);
items.Add().Text("Entities").LoadContentFrom("EntityInfo", "Entity", new { database_pk = Model.database_pk }).Selected(true);
})
.Events(events =>
{
events.Select("selectMenuTabs");
})
)
如果在下拉列表中触发onchange事件,我需要使用我的标签来“重新加载”所选标签
onchange的功能是
function changeDatabase() {
var selected_pk = $('#database_pk').val();
reloadTabstrip();
}
和重新加载功能
function reloadTabstrip() {
var tabStrip = $("#menu").data("kendoTabStrip");
tabStrip.reload($(".item", tabStrip.element)[0]);
}
reloadTabstrip功能不起作用,我很难在网上找到任何指示我正确方向的东西。
答案 0 :(得分:0)
使用以下jquery脚本
解决了问题function reloadTabstripItem() {
var selected_pk = $('#database_pk').val();
var index = $("#menu").data("kendoTabStrip").select().index();
switch (index) {
case 0:
actionurl = "/Home/DatabaseInfo";
break;
case 1:
actionurl = "/Table/TableInfo";
break;
case 2:
actionurl = "/Entity/EntityInfo";
break;
}
$.ajax({
url: "/Home/DatabaseInfo",
type: 'GET',
data: { database_pk: selected_pk }
}).done(function (html) {
$($("#menu").data("kendoTabStrip").contentElement(0)).html(html);
});
}