我有 DropDownList 和 Telerik 的 Kendo UI Grid Control 页面。第一次打开页面时,DropDownList 中没有选择任何项目。只有当用户在 DropDownList 中选择值时,Grid 才会对服务器进行 Ajax 调用并加载相应的数据。
当用户在 DropDownList 中选择项目时,我的代码工作正常,但问题是第一次打开页面时,DropDownList 中没有任何值,并且 Grid 不应该调用服务器。
我的问题是,如果 DropDowList 中没有选择项目,如何防止网格不调用服务器?
<div>
@Html.Kendo().DropDownList().Name("broker").DataTextField("GrandParentName").DataValueField("Id").BindTo(Model).SelectedIndex(@selectedIndex).Events(e => e.Change("brokerChanged"))
</div>
@(Html.Kendo().Grid<OrderViewModel>()
.Name("Orders")
.HtmlAttributes(new {style = "height: 500"})
.Columns(c =>
{
c.Bound(p => p.Id)
.Width(50)
.Title("")
.Sortable(false)
.IncludeInMenu(false)
.ClientTemplate((@Html.ActionLink("Edit", "Index", "Splits", new {Id = "OrderId"}, null).ToHtmlString().Replace("OrderId", "#=Id#")));
c.Bound(p => p.TradeDate)
.Title("Trd Dt")
.Format("{0:d}")
.Width(90)
.HtmlAttributes(new {style = "text-align: right"});
c.Bound(p => p.Price)
.Title("Price")
.Format("{0:n}")
.Width(100)
.HtmlAttributes(new {style = "text-align: right"});
c.Bound(p => p.Status)
.Title("Status");
c.Bound(p => p.Notional)
.Title("Notional")
.Format("{0:n}")
.HtmlAttributes(new {style = "text-align: right"});
})
.Sortable()
.Scrollable()
.ColumnMenu()
.Pageable(x =>
{
x.Enabled(true);
x.PreviousNext(false);
x.PageSizes(false);
x.Info(true);
x.Input(false);
x.Numeric(false);
x.Refresh(true);
x.Messages(y => y.Display("{2} Order(s)"));
})
.Resizable(resize => resize.Columns(true))
.Reorderable(reoder => reoder.Columns(true))
.DataSource(ds => ds.Ajax()
.ServerOperation(false)
.Read(read => read.Action("Action", "MyController").Data("selectedBrokerId")))
)
<script type="text/javascript">
function brokerChanged() {
var grid = $("#Orders").data("kendoGrid");
grid.dataSource.read();
}
function selectedBrokerId() {
var obj = { brokerId: $("#broker").data("kendoDropDownList").value() };
return obj;
}
</script>
非常感谢您的时间和帮助。