We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

In Grid Export to Excel not working

Thread ID:

Created:

Updated:

Platform:

Replies:

145901 Jul 12,2019 12:10 PM UTC Jul 16,2019 05:46 AM UTC ASP.NET MVC - EJ 2 3
loading
Tags: Grid
Fred Morin
Asked On July 12, 2019 12:10 PM UTC

In following code, Export to Excel is not working.  Am I doing something wrong ?

@using Syncfusion.EJ2.Navigations
@using TestWithFilterableComboBox.ViewModels
@model TestWithFilterableComboBox.ViewModels.ReportViewModel
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>


@using (Html.BeginForm())
{

    <table style="width: 100%">
        <tr>
            <th>JobName</th>
            <th>Queued</th>
            <th>LineNo</th>
        </tr>
        <tr>
            <td> @Html.DropDownListFor(x => x.JobName, new SelectList(Model.Jobs, "Value", "Text"), "Job", new { style = "width: 450px;" })</td>
            <td> @Html.DropDownListFor(x => x.QueuedBeamStatus, new SelectList(Model.Queues, "Value", "Text"), "Queue", new { style = "width: 450px;" })</td>
            <td> @Html.DropDownListFor(x => x.LineName, new SelectList(Model.Lines, "Value", "Text"), "Line", new { style = "width: 450px;" })</td>
        </tr>
    </table>
    <br />
    <button type="submit">Search</button>
    <br />
    <br />
    @(Html.EJS().Grid("TestGrid").DataSource(Model.Report).Columns(col =>
              {
                  col.Field("Workorderid").HeaderText("Work Order Id").Width(150).Add();
                  col.Field("FullFilename").HeaderText("Full File Name").Add();
              }).AllowPaging(true).PageSettings(o => o.PageSize(10)).AllowSorting().AllowExcelExport().ToolbarClick("toolbarClick").AllowPdfExport().Toolbar(new List<string>() { "Print", "Search", "ExcelExport", "PdfExport" }).Render())


}



<style>
    .orientationcss .e-headercelldiv {
        transform: rotate(90deg);
    }
</style>


 
<script>
    function toolbarClick(args) {
        var gridObj = document.getElementById("TestGrid").ej2_instances[0];
        if (args.item.id === 'Grid_excelexport') {
            gridObj.excelExport();
        }
    }
</script>

<script type="text/javascript">

    $(function () {
        $("#JobName").change(function () {
            var val = $(this).val();
            var subItems="";
            $.getJSON("@Url.Action("GetQueues","Report")", {id:val} ,function (data) {
                $.each(data,function(index,item){
                    subItems+="<option value='"+item.Value+"'>"+item.Text+"</option>";
                });
                $("#QueuedBeamStatus").html(subItems);
            });
            var subItems2="";
            $.getJSON("@Url.Action("GetLines","Report")", {id:val} ,function (data) {
                $.each(data,function(index,item){
                    subItems2+="<option value='"+item.Value+"'>"+item.Text+"</option>";
                });
                $("#LineName").html(subItems2);
            });
        });
    });
</script>

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On July 15, 2019 06:23 AM UTC

Hi Fred,  

Greetings from Syncfusion.  

We have gone through the provided code example and we could see there is a mismatch between the Grid id and toolbarclick’s item id. Toolbar items and their id will be generated based on the Grid’s id only. It will be as follows,  

Grid ID + _ + item name (small case) 

For an example, Grid ID is TestGrid and we have toolbar item as ‘ExcelExport’. So, to look for a ExcelExport click, check the args.item.id as ‘TestGrid_excelexport’. 

 
@(Html.EJS().Grid("TestGrid")..AllowSorting().AllowExcelExport().ToolbarClick("toolbarClick").AllowPdfExport().Toolbar(new List<string>() { "Print", "Search", "ExcelExport", "PdfExport" }).Render()) 
 
<script> 
    function toolbarClick(args) { 
        var gridObj = document.getElementById("TestGrid").ej2_instances[0]; 
        if (args.item.id === 'TestGrid_excelexport') { 
            gridObj.excelExport(); 
        } 
    } 
</script> 

Regards,  
Seeni Sakthi Kumar S. 


Fred Morin
Replied On July 15, 2019 05:56 PM UTC

Simply beautiful.  thanks a lot

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On July 16, 2019 05:46 AM UTC

Hi Fred,  

Thanks for the update. We are happy to hear that your requirement has been achieved and you are good to go.  

Regards,  
Seeni Sakthi Kumar S. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon