Excel export stopped working

2 posts, 0 answers
  1. David
    David avatar
    1 posts
    Member since:
    Aug 2016

    Posted 18 Oct Link to this post

    I am using 3 Kendo grids.

    Each grid has the ability to Export to Excel using toolbar template. 

    This was all working until recently. Now it does not work on any grid. 

    I am not sure what environmental issue I created. 

    Here is the code. 

     

    BundledConfig:

      //Telerik 
                bundles.Add(new ScriptBundle("~/bundles/kendo").Include(
                    "~/Scripts/kendo/kendo.all.min.js",
                    "~/Scripts/kendo/kendo.web.min.js",
                    "~/Scripts/kendo/kendo.aspnetmvc.min.js",
                     "~/Scripts/jszip.min.js"));

    View:

       <div class='pull-left'>
            <a class="k-button k-button-icontext" href="javascript:void(0)" onclick="customCommand()"><span class="k-icon k-add"></span>Add new transfer</a>
            <button class="k-button k-button-icontext k-grid-excel" type="button"><span class="k-icon k-i-excel"></span>Export to Excel</button>
            <button class="k-button k-button-icontext k-grid-pdf"><span class="k-icon k-i-pdf"></span>Export to PDF</button>

    @helper ToolbarTemplate2()
    {
        <div class='pull-left'>
            <button class="k-button k-button-icontext k-grid-excel" type="button"><span class="k-icon k-i-excel"></span>Export to Excel</button>
            <button class="k-button k-button-icontext k-grid-pdf"><span class="k-icon k-i-pdf"></span>Export to PDF</button>
        </div>
    }

    @(Html.Kendo().Grid<TransferView>()
                        .Name("grid")
                        .Columns(columns =>
                        {
                            columns.Bound(e => e.TransferId).Title("ID").Width(60);
                            columns.Bound(e => e.FromDescription).Width(180);
                            columns.Bound(e => e.ToDescription).Width(180);
                            columns.Bound(e => e.FromDept).Width(120);
                            columns.Bound(e => e.ToDept).Width(120);
                            columns.Bound(e => e.CreateDate).Hidden();
                            columns.Bound(e => e.CreateProfile).Hidden();
                            columns.Bound(e => e.ChangeDate).Hidden();
                            columns.Bound(e => e.ChangeProfile).Hidden();
                            columns.Bound(e => e.ApprovalFlag).Hidden();
                            columns.Bound(e => e.ApprovalDate).Hidden();
                            columns.Bound(e => e.ApprovalProfile).Hidden();
                            columns.Bound(e => e.PostedDate).Hidden();
                            columns.Bound(e => e.PostedFlag).Hidden();
                            columns.Bound(e => e.ReceivedDate).Hidden();
                            columns.Bound(e => e.TrnComment).Hidden();
                            columns.Command(command =>
                            {
                                command.Custom("Edit").Click("showDetails");
                                command.Custom("Delete").Click("deleteTransfer").HtmlAttributes(new { @style = "border-color: #b92c28; background-color: #d9534f; color:white" });
                            }).Width("20%");
                        })
                        .Sortable()
                        .Filterable(ftb => 
                        {
                            ftb.Mode(GridFilterMode.Row);
                        })
                    .ColumnMenu()
                    .ToolBar(toolbar =>
                    {
                    toolbar.Template(@<text>@ToolbarTemplate()</text>);
                    })
                    .Sortable()
                    .Pageable()
                    .Scrollable(a => a.Height("auto"))
                    .Resizable(resize => resize.Columns(true))
                    .Excel(excel => excel
                            .FileName("alltransfers.xlsx")
                            .Filterable(true)
                            .AllPages(true)
                          )
                    .Groupable()
                    .Reorderable(Reorder => Reorder.Columns(true))
                    .Navigatable()
                    .Pageable(pager => pager.PageSizes(new[]
                        {
                            10,
                            20,
                            30,
                            40,
                            50,
                            100
                        }))

                    .ClientDetailTemplateId("template")
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(10)
                        .Read(read => read.Action("GetAllTransfersForStore", "Transfer"))
                    )
                    .Events(events => events
                      .DataBound("dataBound")
                      .DetailExpand("detailExpand"))
    )

    <script id="template" type="text/kendo-tmpl">
        @(Html.Kendo().TabStrip()
                .Name("tabStrip_#=TransferId#")
                .SelectedIndex(0)
                .Animation(animation => animation.Open(open => open.Fade(FadeDirection.In)))
                .Items(items =>
                {
                items.Add().Text("Transactions")
                    .Content(
                    @<text>
                        @RenderTabStrip()
                    </text>);
                    items.Add().Text("Transfer Information").Content(
                           "<div class='row'>" +
                            "<div class='col-md-4'>" +
                                "<ul>" +
                                    "<li><label>Created Date</label> #= CreateDate #</li>" +
                                    "<li><label>Created By</label> #= CreateProfile #</li>" +
                                    "<li><label>Changed Date</label> #= ChangeDate #</li>" +
                                    "<li><label>Changed By</label> #= ChangeProfile #</li>" +
                                     "<li><label>Received Date </label> #= ReceivedDate #</li>" +

                                "</ul>" +
                            "</div>" +
                            "<div class='col-md-4'>" +

                                "<ul>" +

                                "<li><label>Approval Yes/No</label> #= ApprovalFlag #</li>" +
                                "<li><label>Approval Date</label> #= ApprovalDate #</li>" +
                                 "<li><label>Approval Profile</label> #= ApprovalProfile #</li>" +
                                "<li><label>Posted Date</label> #= PostedDate #</li>" +
                                "<li><label>Posted Yes/No</label> #= PostedFlag #</li>" +
                            "</ul>" +
                            "</div>" +
                        "</div>"

                              );

                })
                .ToClientTemplate())}

        @helper RenderTabStrip()
        {    @(Html.Kendo().Grid<TransferLine>()
                    .Name("grid_#=TransferId#")
                    .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                    .ColumnMenu()
                    .ToolBar(toolbar =>
                     {
                         toolbar.Template(@<text>@ToolbarTemplate2()</text>);
                     })
                    .Sortable()
                    .Pageable()
                    .Resizable(resize => resize.Columns(true))
                    .Scrollable(a => a.Height("auto"))
                    .Groupable()
                    .Reorderable(Reorder => Reorder.Columns(true))
                    .Navigatable()
                    .Pageable(pager => pager.PageSizes(new[]
                        {
                            10,
                            20,
                            30,
                            40,
                            50,
                            100
                        }))
                    .Columns(columns =>
                    {
                        //columns.Bound(e => e.FromStoreNumber).Hidden();
                        //columns.Bound(e => e.T).Hidden());
                        //columns.Bound(e => e.FromDept).hidden();
                        //columns.Bound(e => e.ToDept).hidden();
                        columns.Bound(e => e.TransferId).Title("ID").Width(70);
                        columns.Bound(e => e.ItemUpc).Title("UPC").Width(500);
                        columns.Bound(e => e.Quantity).Width(120);
                        columns.Bound(e => e.UnitPrice).Width(120);
                        columns.Bound(e => e.ItemUOM).Width(120);
                        columns.Bound(e => e.ExtendedPrice).Format("{0:C}").Width(120);
                        columns.Bound(e => e.TrnComment).Hidden();
                        //columns.Command(command =>
                        //{
                        //    command.Custom("Delete").Click("deleteLine");
                        //}).Width("20%");

                    })
                    .DataSource(dataSource => dataSource
                        .Ajax()
                        .PageSize(10)
                    .Read(read => read.Action("GetAllLinesForId", "Transfer", new { id = "#=TransferId#" }))

                    )
                    .Pageable()
                    .Sortable()
                    .ToClientTemplate())
    }
    </script>

    Any ideas would be appreciated. 

     

     

     

  2. Stefan
    Admin
    Stefan avatar
    264 posts

    Posted 19 Oct Link to this post

    Hello David,

    There is a known issue with the Grid' Excel export in the latest version of Kendo UI 2016.3.914 with combination of a specific jQuery versions:

    https://github.com/telerik/kendo-ui-core/issues/2239

    Please check if changing the jQuery version to one of the listed in the issue (1.12.1 recommended) will fix the issue.

    Regards,
    Stefan
    Telerik by Progress
     
    Build rich, delightful, *native* Angular 2 apps with Kendo UI for Angular 2. Try it out today! Kendo UI for Angular 2 (currently in beta) is a jQuery-free toolset, written in TypeScript, designed from the ground up to offer true, native Angular 2 components.
     
  3. Kendo UI is VS 2017 Ready
Back to Top