Kendo Grid UI excel export hide column

[Mark]

Hi there,

I'm using a Kendo UI Grid for MVC, with an excel export option.  One column is HTML straight from the database as comes into the excel as raw HTML so I'd like to hide this column.  I've tried adapting the code from a separate thread (http://www.telerik.com/forums/export-to-grid-hide-columns) for standard UI rather than MVC but it isn't achieving what I want (see code below) - this is what happens :-

a) On the 1st click of Export to Excel it does nothing
b) On the second click it hides the column on the page but doesn't do the excel export
c) on the 3rd click it shows the column on the page again and does the excel export, but without the column removed

Any help would be appreciated :)

This is my view code :-

<script>

    // setup the page
    $(window).load(function () {
        var grid = $("#grid").data("kendoGrid");
        var exportFlag = false;
        grid.bind("excelExport", function (e) {
            if (!exportFlag) {
                alert(1);
                e.sender.hideColumn(1);
                e.preventDefault();
                exportFlag = true;
                setTimeout(function () {
                    e.sender.saveAsExcel();
                });
            } else {
                alert(2);
                e.sender.showColumn(1);
                exportFlag = false;
            }
        });
    })

</script>

@( Html.Kendo().Grid<TEAMSPortalV2.Models.SiteViewModel>()
    .Name("grid")
    .DataSource(datasource => datasource
        .Ajax()
        .Read(read => read.Action("GetSites", "Site"))
        .Sort(sort => sort.Add("AddressWithPostcode").Ascending())
    )
    .Columns(columns =>
    {
        columns.Bound(site => site.UPRN).Title("UPRN");
        columns.Bound(site => site.AddressWithPostcode).Title("Address");
        columns.Bound(site => site.Contact).Title("Contact");
        columns.Bound(site => site.Telephone).Title("Telephone");
        columns.Bound(site => site.SampleResultsOverview).Title("Rec. Action").Encoded(false);
        columns.Template(site => { }).ClientTemplate(" ").Title("Site Documents");
    })
    .ClientRowTemplate(Html.Partial("~/Views/Site/SiteTemplate.cshtml").ToHtmlString())
    .Sortable()
    .ToolBar(tools =>
    {
        tools.Template(@<text>
            <div class="toolbar">
                <a class="k-button k-button-icontext k-grid-excel" href="#"><span class="k-icon k-i-excel"></span>Export to Excel</a>
                <a href="#" onclick="alert('filter!');"><img src="~/Content/images/icons/filter.png" class="floatright" style="padding: 3px;" /></a>
            </div>
        </text>);
    })
    .Pageable(pageable => pageable
                .Refresh(true)
                .PageSizes(true)
                .ButtonCount(5))
    .Excel(excel => excel
                .FileName("sites.xlsx")
                .AllPages(true))
)

[Dimiter Madjarov]

Hello Mark,

You could directly use the Grid configuration to attach the handler to the excelExport event.
E.g.

.Events(e => e.ExcelExport("excelExport"))

Regarding the code for the handler, it looks correct.
E.g.

var exportFlag = false;

function excelExport(e) {
    if (!exportFlag) {
        e.sender.hideColumn(1);
        e.preventDefault();
        exportFlag = true;
        setTimeout(function () {
            e.sender.saveAsExcel();
        });
    } else {
        e.sender.showColumn(1);
        exportFlag = false;
    }
}

Let me know if the problem is still reproducing.

Regards,
Dimiter Madjarov
Telerik

 

 

[Mark]

Thanks Dimiter,

Unfortunately I tried that just now and got exactly the same symptoms (as described in my original post).  My revised code is posted below.  Any ideas what else I can try?

Thanks,

Mark

============

<script>

    var exportFlag = false;

    function excelExport(e) {
        if (!exportFlag) {
            e.sender.hideColumn(1);
            e.preventDefault();
            exportFlag = true;
            setTimeout(function () {
                e.sender.saveAsExcel();
            });
        } else {
            e.sender.showColumn(1);
            exportFlag = false;
        }
    }

</script>

@( Html.Kendo().Grid<TEAMSPortalV2.Models.SiteViewModel>()
    .Name("grid")
    .DataSource(datasource => datasource
        .Ajax()
        .Read(read => read.Action("GetSites", "Site"))
        .Sort(sort => sort.Add("AddressWithPostcode").Ascending())
    )
    .Columns(columns =>
    {
        columns.Bound(site => site.UPRN).Title("UPRN");
        columns.Bound(site => site.AddressWithPostcode).Title("Address");
        columns.Bound(site => site.Contact).Title("Contact");
        columns.Bound(site => site.Telephone).Title("Telephone");
        columns.Bound(site => site.SampleResultsOverview).Title(@sessionHelper.RecActionHeader).Encoded(false);
        columns.Template(site => { }).ClientTemplate(" ").Title("Site Documents");
    })
    .ClientRowTemplate(Html.Partial("~/Views/Site/SiteTemplate.cshtml").ToHtmlString())
    .Sortable()
    .ToolBar(tools =>
    {
        tools.Template(@<text>
            <div class="toolbar">
                <a class="k-button k-button-icontext k-grid-excel" href="#"><span class="k-icon k-i-excel"></span>Export to Excel</a>
                <a href="#" onclick="toggleSiteFilter();"><img src="~/Content/images/icons/filter.png" class="floatright" style="padding: 3px;" title="Show/Hide Filters" /></a>
                <div class="toolbar_filter" style="display:none;">  @*initially hidden*@
                    @Html.Partial("~/Views/Site/SiteFilterPanel.cshtml")
                </div>
            </div>
        </text>);
    })
    .Pageable(pageable => pageable
                .Refresh(true)
                .PageSizes(true)
                .ButtonCount(5))
    .Events(e => e.ExcelExport("excelExport"))
    .Excel(excel => excel
                .FileName("sites.xlsx")
                .AllPages(true))
)

[Dimiter Madjarov]

Hello Mark,

The provided sample code seems correct. Please send us small isolated runnable example, that we could inspect locally and provide further assistance. I am looking forward to hearing from you.

Regards,
Dimiter Madjarov
Telerik

 

 

[Mark]

Thanks Dimiter,

I may come back to this later on - we're under tight timescales currently so I will pick this up later after more pressing development is done first. Thank you for coming back to me so soon. 

Thanks,

Mark

[Dimiter Madjarov]

Hello Mark,

Thanks for the update.

I wish you a great weekend!

Regards,
Dimiter Madjarov
Telerik