Telerik 网格和 Ajax

Question

我正在尝试使用 ASP.NET MVC 2 创建一个页面，该页面显示两件事：

1. the upper half of the page should show a form
2. the lower half should show the results based on the information from the form

我尝试做的是使用 Ajax.BeginForm 并使用 UpdateTargetId 更新页面的下半部分。基本上，这有效。但是，结果还包含可分页的 Telerik 网格。这就是麻烦开始的地方。

网格基本上显示得很好，但当我尝试浏览网格页面时，它开始出错。普通（非 Ajax）网格使用链接。如果我使用网格的这种变体，我就会遇到麻烦，因为链接请求一个新页面，该页面不包含表单中的任何信息，因此我会收到一堆错误。

如果我打开 Ajax，它也不起作用，因为这不适用于通过 Ajax 检索的部分视图（在这种情况下脚本标记不起作用）。在本例中，我只得到一个呈现为纯文本的 JSON 结果对象。

如果我把它们全部放在一个页面上，我也可以让它工作。但由于某种原因，网格不会使用 Ajax。在索引视图上，我使用以下代码来呈现网格：

       Html.Telerik().Grid<FoobarListItem>()
         .Name("Foobar")
         .DataBinding(dataBinding => dataBinding.Ajax().Select("_Paging", "Foobar"))
         .ToolBar(commands => commands
            .Custom()
            .HtmlAttributes(new { id = "export", onclick = onclickValue })
            .Text(Html.Alias("default", "ExportCSV"))
            .Url("#")
         )
         .Columns(columns =>
         {
             //Template column which shows an action link
             columns.Bound(o => o.Datum);
             columns.Bound(o => o.VerbruikLaag);
             columns.Bound(o => o.VerbruikNormaal);
             columns.Bound(o => o.VerbruikPiek);
         })
         .Scrollable(scrolling => scrolling.Height(200).Enabled(false))
         .Pageable()
         .Localizable("nl-NL")
         .Render();
}

但无论我是否放入 Ajax 数据绑定，它仍然以相同的方式呈现表格。有谁知道我哪里出错了？

Answer 1

查看此帮助话题。默认情况下，Ajax.BeginForm 不执行在 ajax 响应中返回的 JavaScript，您需要一些 jQuery 代码才能使其工作。帮助主题显示了所需的代码。 ASP.NET MVC 3 引入的新的不显眼的 ajax 框架很可能不需要这样做。

Answer 2

Telerik Grid 客户端事件

包含您想要实现的目标的示例。这是 OnRowselect 事件。您可以处理该事件并访问所有网格信息，然后进行 jquery 调用以检索视图的下半部分。

Answer 3

事实证明，实际问题是需要手动包含所需的 javascript 文件。对于最新版本的 Telerik，这种情况会自动发生，即使对于通过 Ajax 加载的组件也是如此。

我通过将表单转换为常规 HTML 表单解决了我的问题。根据表的数据在模型中是否可用，网格会加载到同一页面上。分页的工作方式相同。