为什么DatasourceRequest没有在工具栏上传递'；s在剑道网格中的自定义命令

本文关键字：网格 自定义 命令 DatasourceRequest 工具栏 为什么 | 更新日期: 2023-09-27 18:27:34

我试图在剑道网格的工具栏上创建一个自定义命令按钮。代码类似

Html.Kendo().Grid...
.ToolBar(commands => commands.Custom().Text("Export").Action("ExportAthletePageToExcel", "ExportExcelButton", new { selectedSportId = Model.CurrentSport, yearId = Model.CurrentYear }))
...
Controller is like,
public ActionResult ExportAthletePageToExcel(DataSourceRequest request, string selectedSportId, string yearId)
...

它适用于selectedSportId和yearId等参数，但请求没有正确的网格信息（过滤器、排序、页面等）。我想知道问题出在哪里。

谢谢。

为什么DatasourceRequest没有在工具栏上传递'；s在剑道网格中的自定义命令

我无意中发现了一个我喜欢的解决方案。Telerik发布了一个将网格内容导出到Excel的演示。它们使用自定义命令，并使用网格的OnDataBound事件在客户端以javascript设置DataSourceRequest参数。我在这里为你整理了相关的部分。。。

  1. 在Action的routevalues中包括四个DataSourceRequest参数，但使用占位符波浪号，这些波浪号将在步骤2:中被替换

    .ToolBar(commands => commands.Custom().Text("Export").Action("ExportAthletePageToExcel", "ExportExcelButton", new { page = "~", pageSize = "~", filter = "~", sort = "~", selectedSportId = Model.CurrentSport, yearId = Model.CurrentYear }))

  2. 在DataBound事件中包括对javascript函数的调用：

    .Events(ev => ev.DataBound("onDataBound"))

  3. 然后将以下脚本添加到页面：

    function onDataBound(e) {
var grid = this;
// ask the parameterMap to create the request object for you
var requestObject = (new kendo.data.transports["aspnetmvc-server"]({ prefix: "" }))
.options.parameterMap({
    page: grid.dataSource.page(),
    sort: grid.dataSource.sort(),
    filter: grid.dataSource.filter()
});
// Get the export link as jQuery object
var $exportLink = grid.element.find('.export');
// Get its 'href' attribute - the URL where it would navigate to
var href = $exportLink.attr('href');
// Update the 'page' parameter with the grid's current page
href = href.replace(/page=([^&]*)/, 'page=' + requestObject.page || '~');
// Update the 'sort' parameter with the grid's current sort descriptor
href = href.replace(/sort=([^&]*)/, 'sort=' + requestObject.sort || '~');
// Update the 'pageSize' parameter with the grid's current pageSize
href = href.replace(/pageSize=([^&]*)/, 'pageSize=' + grid.dataSource._pageSize);
//update filter descriptor with the filters applied
href = href.replace(/filter=([^&]*)/, 'filter=' + (requestObject.filter || '~'));
// Update the 'href' attribute
$exportLink.attr('href', href);

    }

  4. 现在，在您的控制器方法中，您将可以访问DataSourceRequest，并使用当前状态填充所有相关参数。还要注意的是，您在方法的请求参数中缺少属性[DataSourceRequest]，所以它看起来应该是这样的：

    public ActionResult ExportAthletePageToExcel([DataSourceRequest]DataSourceRequest request, string selectedSportId, string yearId)

我不认为自定义工具栏应该发送数据源请求，不过您可以尝试使用javascript来发送。

例如：

function exportAthletePageToExcel(){
   var dataSource = $('#YourGrid').data('kendoGrid').dataSource;
   var dataSourceRequest = dataSource.transport.parameterMap({
        filter: dataSource.filter(),
        page: dataSource.page(),
        pageSize: dataSource.pageSize(),
        sort: dataSource.sort()
   });
   var data = "";
   for (var key in dataSourceRequest) {
       if (dataSourceRequest[key] !== undefined) {
           data += key + "=" + dataSourceRequest[key] + "&";
       }
   }
   $.ajax({
        type: "POST",
        contentType: "application/x-www-form-urlencoded; charset=UTF",
        url: '@Html.Action("ExportAthletePageToExcel", "ExportExcelButton", new { selectedSportId = Model.CurrentSport, yearId = Model.CurrentYear })',
        data: data,
        success: function(){
            dataSource.read();
        }
   });
}
相关文章：