Telerik MVC Grid Ajax 手动绑定

Posted 2023-04-13

【中文标题】Telerik MVC Grid Ajax 手动绑定

【英文标题】：Telerik MVC Grid Ajax with manually binding

【发布时间】：2012-07-25 16:13:41

【问题描述】：

我有一个 Telerik MVC Grid 使用 ajax 来获取数据，我想控制它何时加载。

这是我认为的代码：

@(html.Telerik().Grid<ViewModels.Reports.UserActionLoggingDetailViewModel>()
          .Name("UserActionLoggingFollowedGrid")
          .DataBinding(dataBinding => dataBinding.Ajax().Select("SelectUserActionLogging", "Report", new  userTeamId = Model.UserTeamId, startDate = Model.StartDate, endDate = Model.EndDate ).OperationMode(GridOperationMode.Client))
          .Columns(columns =>
                      
                         columns.Bound(x => x.FullName).Hidden();
                         columns.Bound(x => x.ActionName);
                         columns.Bound(x => x.ActionCount);
                      )
          .Pageable(page => page.PageSize(20))
          .Sortable()
          .Groupable(grouping => grouping.Groups(groups => groups.Add(c => c.FullName)).Visible(false))
          .Filterable()
          .Localizable("fr-FR")
          .HtmlAttributes(new  @class = "grid-style static-grid-style" )
          .ClientEvents(e => e.OnError("Grid_onServerError").OnDataBinding("Grid_onDataBinding").OnDataBound("Grid_onDataBound"))
        )

默认情况下，此代码可以正常工作。加载页面时，网格会自动向服务器发送一个 post 请求以执行指定的操作，并使用返回的数据自行加载。

我想要的是具有相同行为但在加载页面时不加载数据的相同网格；我希望在用户单击按钮或任何其他操作时加载网格。

我发现了一些有趣的帖子，说明如何手动刷新网格，但没有人指定如何防止网格的初始绑定。

【参考方案1】：

这件小作品对我有用。添加一个数据绑定客户端事件（显然您已经拥有）：

.ClientEvents(events => events
    .OnDataBinding("preventAjaxSelectOnPageLoad"))

然后创建添加这个javascript：

<script type="text/javascript">

    var gridsToBind = [];

    function preventAjaxSelectOnPageLoad(e)
    
        if ($.inArray(e.target.id, gridsToBind) == -1)
        
            e.preventDefault();
            gridsToBind.push(e.target.id);
        
    
</script>

基本上，您创建一个数组来跟踪需要绑定的网格。当页面加载时，数组将为空——此时，它取消数据绑定事件并将网格添加到数组中。那么下次调用ajaxRequest()时，grid存在数组中，可以正常绑定了。

【参考方案2】：

我认为您可以为网格的 DataBinding 或 DataBound 事件添加一个处理程序，并检查它是否是那里页面的第一次加载。如果是这样，请使用 e.preventDefault() 以避免调用服务器。

其他选项可能是从 Grid 声明中删除 ajax 绑定，并使用 dataBind method 自行完成