Kendo MVC - 导出到Excel

时间:2014-12-24 15:44:57

标签: excel razor kendo-grid export-to-excel kendo-asp.net-mvc

我有一个kendo mvc网格,我正在尝试将数据导出到excel。

这是我的.chhtml。

<div class="panel-body table-responsive">
    @{
        var gridBuilder = CodeTaskKendoGrid.CreateTaskGrid(Model.TaskOverviewList, Model.ViewableExtraFields, this.Html, Model.Configuration);

        gridBuilder.ToolBar(tools => tools.Excel())
            .Excel(excel => excel
                .AllPages(true)
                .ProxyURL(Url.Action("Excel_Export_Save", "Task"))
            );
    }
    @gridBuilder.ClientDetailTemplateId("client-template")

</div>
<script id="client-template" type="text/x-kendo-template">
# if (SubTasks != null && SubTasks.length > 0) { #
<text>

    <table class="adra-kendo-table">
        # var j = SubTasks.length; #
        # for(var i = 0; i < j; i++) { #
        # var ownerName= SubTasks[i].OwnerName; #
        # var taskStatusId= SubTasks[i].TaskStatusId; #
        # var taskId = SubTasks[i].Id; #
        # var periodId = SubTasks[i].PeriodId; #
        # var teamId = SubTasks[i].TeamId; #
        <tr>
            <td>#: SubTasks[i].Id #</td>
            <td>#: SubTasks[i].Name #</td>

            <td class="# @CodeTaskKendoGrid.OwnerClass("ownerName") #"># @CodeTaskKendoGrid.OwnerName("ownerName") #</td>
            <td>#: SubTasks[i].TaskStatus #</td>
            <td>#: SubTasks[i].ApprovalStatus #</td>
            <td><a class="btn btn-warning btn-xs" href="/Task/EditTask?taskId=#=taskId#&amp;periodId=#=periodId#&amp;teamId=#=teamId#" type="button">Edit</a></td>
        </tr>

        # } #
    </table>

</text>
# } #

这就是我生成网格的地方(这是另一个.cshtml文件,我用它来生成网格。我从上面的文件中调用此文件中的方法)

public static GridBuilder<DtoTaskExtended> CreateTaskGrid(IEnumerable<DtoTaskExtended> taskList, IEnumerable<DtoExtraField> viewableExtraFields , System.Web.Mvc.HtmlHelper htmlHelper, TaskGridConfig gridConfig)
{

    ExtraFieldConfigs = viewableExtraFields;
    Helper = htmlHelper;
    GridConfig = gridConfig;
    var retObj = Helper.Kendo().Grid(taskList)

        .Name("AdraKendoGrid")
        .DataSource(dataSource => dataSource
               .Ajax()
               .Read(read => read.Action("GetTaskResult", "Task"))
        )

        .Columns(ColumnsConfigurator)
        .Groupable(gr => gr.Messages(message => message.Empty(Strings.kendoGroupMsg)))
        .Pageable(pager => pager.PageSizes(new int[] { 15, 50, 100, 500 })
            .Info(true)
            .Messages(message => message.Display("{0} - {1} " + Strings.of + "{2} " + Strings.items))
            .Messages(message => message.ItemsPerPage(Strings.itemsPerPage))
            .Messages(message => message.Empty(Strings.noItemsToDisplay)))
        .Resizable(r => r.Columns(true))
        .Sortable()
        .Reorderable(reorder => reorder.Columns(true))
        .Resizable(r => r.Columns(true))

        .ColumnMenu();



    return retObj;
}

最后,这是我的控制器操作,应该从excel导入按钮调用。

[HttpPost]
    public ActionResult Excel_Export_Save(string contentType, string base64, string fileName)
    {
        var fileContents = Convert.FromBase64String(base64);

        return File(fileContents, contentType, fileName);

    }

但是当单击网格中的Excel导入按钮时,甚至不会调用此控制器操作。

我做错了什么?任何建议表示赞赏。 谢谢。

指定后

.ToolBar(tools => tools.Excel())
        .Excel(excel => excel
            .AllPages(true)
            .ProxyURL(Url.Action("Excel_Export_Save", "Task"))
        );

并创建相关的行动方法,我还应该做些什么吗?

我尝试了很多例子,但我的按钮(导出到Excel)按钮没有做任何事情。我也导入了jsZip.js文件(如Kendo Demo中所指定)。我遵循以下示例。

http://demos.telerik.com/aspnet-mvc/grid/excel-export

http://docs.telerik.com/kendo-ui/aspnet-mvc/helpers/grid/excel-export

感谢任何形式的帮助。我被困在这里。

2 个答案:

答案 0 :(得分:1)

一种解决方案是:

&#13;
&#13;
<script src="//cdnjs.cloudflare.com/ajax/libs/jszip/2.4.0/jszip.min.js"></script>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

问题在于我使用的Kendo MVC版本。 Kendo 2014 Q3(2014.3.1119)版本支持Excel导出。