我有带有 DropDownList 和 Telerik 的 Kendo UI 网格控件的页面。第一次打开页面时，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> 

请您参考如下方法:

有一个autobind网格函数。您可以使用它来确定在页面首次加载时是否阅读。这应该可以工作(假设 selectedIndex 确定是否选择了下拉值):

@(Html.Kendo().Grid<OrderViewModel>() 
      .Name("Orders") 
      .HtmlAttributes(new {style = "height: 500"}) 
      .AutoBind(selectedIndex > 0)  
      //rest of your grid declaration