This is a migrated thread and some comments may be shown as answers.

Kendo Grid UI excel export hide column

5 Answers 580 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Mark
Top achievements
Rank 1
Mark asked on 01 Jul 2015, 08:44 AM

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))
)

5 Answers, 1 is accepted

Sort by
0
Dimiter Madjarov
Telerik team
answered on 02 Jul 2015, 02:23 PM

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
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Mark
Top achievements
Rank 1
answered on 02 Jul 2015, 03:24 PM

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))
)

0
Dimiter Madjarov
Telerik team
answered on 03 Jul 2015, 09:10 AM

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
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Mark
Top achievements
Rank 1
answered on 03 Jul 2015, 11:57 AM

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

0
Dimiter Madjarov
Telerik team
answered on 03 Jul 2015, 12:34 PM

Hello Mark,

Thanks for the update.

I wish you a great weekend!

Regards,
Dimiter Madjarov
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
Tags
Grid
Asked by
Mark
Top achievements
Rank 1
Answers by
Dimiter Madjarov
Telerik team
Mark
Top achievements
Rank 1
Share this question
or