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. Image for the cookie policy date

In Grid Export to Excel not working

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>

3 Replies

SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team 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. 



FM Fred Morin July 15, 2019 05:56 PM UTC

Simply beautiful.  thanks a lot


SS Seeni Sakthi Kumar Seeni Raj Syncfusion Team 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. 


Loader.
Up arrow icon