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

Grid MultipleExporting to Excel Waiting popup

Hi,

I have four grid in my view page and I want to export in one excel file.
I used this sample http://mvc.syncfusion.com/demos/web/grid/multipleexporting and works fine.

Now i want to add a waiting popup, i tried to use this sample
https://www.syncfusion.com/forums/126072/ejgrid-export-to-excel-waiting-popup

but in model passed to controller by ajax call 

JAVASCRIPT:

 $.ajax({ 
          type: "POST", 
          url: url, 
          data: { GridModel: JSON.stringify(model) }
                  ..........

Controller:
public ActionResult MultipleExportTo(string[] GridModel, string typeExport)
        {
            //typeExport -> "xlsx" or "pdf"
                      
            for (int i = 0; i < GridModel.Count(); i++) 
              ...

i find only the first grid.

GridModel.Count()=1 !! 



How to pass all the grids ? 

Thanks


1 Reply

VA Venkatesh Ayothi Raman Syncfusion Team June 14, 2017 06:50 AM UTC

Hi Nicola, 

Thanks for contacting Syncfusion support. 

In this “https://www.syncfusion.com/forums/126072/ejgrid-export-to-excel-waiting-popup  forum we have send the GridModel to server side for a single Grid. But your scenario you are using multiple Grid then we suggest you to send the all Grid models in AJAX post. 

For demonstration purpose, we have passed the two Grid model’s to server side like as follows, 
Code example
First Grid 
 
@(Html.EJ().Grid<object>("MasterGrid") 
        .Datasource((IEnumerable<object>)ViewBag.datasource1) 
        .SelectedRowIndex(0) 
        .AllowMultipleExporting() 
                 .ToolbarSettings(toolBar => toolBar.ShowToolbar().ToolbarItems(items => 
                        { 
                            items.AddTool(ToolBarItems.ExcelExport); 
                            items.AddTool(ToolBarItems.WordExport); 
                            items.AddTool(ToolBarItems.PdfExport); 
                        })) 
                                                                                 .ClientSideEvents(eve => 
                                            { 
                                                eve.ToolbarClick("toolbarClick"); 
                                            }) 
                       
                      .Columns(col => 
        { 
            . . . 
        }) 
         
) 
 
Second Grid 
<div class="label1"> 
    Orders Grid 
</div> 
@(Html.EJ().Grid<object>("DetailGrid") 
        .Datasource((IEnumerable<object>)ViewBag.datasource2) 
        .AllowPaging(false) 
        .Columns(col => 
        { 
            . . . 
 
        }) 
) 
 
function toolbarClick(args) { 
 
            var url = null; 
            if (args.itemName == "Excel Export") { 
                args.cancel = true; 
                url = "/Grid/MultipleExportToExcel"; 
            } 
 
            if (args.itemName.indexOf("Export") != -1) { 
                $(".e-grid").ejWaitingPopup("show"); //show the waiting popup for all Grid 
                var firstGridModel = this.model, secondGridObject = $("#DetailGrid").data("ejGrid"), secondGridModel = secondGridObject.model, allModel = [JSON.stringify(firstGridModel), JSON.stringify(secondGridModel)]; 
                                
                var model = $.extend(true, [], allModel); 
                . . . 
  $.ajax({ 
                type: "POST", 
                url: url, 
                data: { GridModel: model },//pass the grid model 
                dataType: "json", 
                success: function (response) { 
                    $(".e-grid").ejWaitingPopup("hide");//hide the waiting popup for all Grid 
                    alert("Grid Exported"); 
                    location.reload(); 
 
                }, 
                error: function (Result) { 
                    $(".e-grid").ejWaitingPopup("hide"); //hide the waiting popup for all Grid 
                    alert("Grid Exported"); 
                     
                    location.reload(); 
                } 
            });            } 
        } 
 
@Control side 
 
  public object MultipleExportToExcel(string[] GridModel) 
        { 
            ExcelExport exp = new ExcelExport(); 
            var EmployeeData = new NorthwindDataContext().EmployeeViews.Take(5).ToList(); 
            var OrderData = new NorthwindDataContext().OrdersViews.Take(5).ToList(); 
            bool initial = true; 
            IWorkbook book = null; 
             
            foreach (string gridProperty in GridModel) 
            { 
                GridProperties gridProp = ConvertObject(gridProperty); 
                if (initial) 
                { 
                    gridProp.Locale = ""; 
                    book = exp.Export(gridProp, EmployeeData, "Export.xlsx", ExcelVersion.Excel2010, true, true, "flat-saffron", true); 
                    initial = false; 
                } 
                else 
                { 
                   exp.Export(gridProp, OrderData, "Export.xlsx", ExcelVersion.Excel2010, true, true, "flat-saffron", false, book, MultipleExportType.AppendToSheet, "Second Grid"); 
                    book.SaveAs(@"C:\Uploadfiles\Export.xlsx");   //save the file in local. Here you can specify the your own path                
                     
                } 
                  
            } 
            return Json(EmployeeData,JsonRequestBehavior.AllowGet); 
        } 
 

Refer to the following Help documentation for saving the work book as local save, 
  
We have also prepared a sample for your convenience which can be download from following link, 



Regards, 
Venkatesh Ayothiraman. 


Loader.
Up arrow icon