加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

telerik – 如何按需使用Kendo Grid Ajax Read事件

发布时间:2020-12-16 02:49:33 所属栏目:百科 来源:网络整理
导读:我有DropDownList和Telerik的Kendo UI网格控件的页面.当第一次打开页面时,DropDownList中没有选择任何项目.当用户只在DropDownList中选择值时,Grid应该对服务器进行Ajax调用并加载相应的数据. 当用户在DropDownList中选择项目时,我的代码工作正常,但问题是第
我有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

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读