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.
Unfortunately, activation email could not send to your email. Please try again.

Export to PDF with Nested Grid

Thread ID:

Created:

Updated:

Platform:

Replies:

124136 May 19,2016 10:29 AM May 23,2016 04:26 AM JavaScript 3
loading
Tags: ejGrid
Lory
Asked On May 19, 2016 10:29 AM

Hi Team,

I have a nested grid that could be exported to PDF as shown https://www.syncfusion.com/kb/4487/how-to-export-grid-to-word-excel-and-pdf-in-javascript

I have no problem exporting the grid if I'm just showing the main/parent grid but once I expand a child grid then click on Export to PDF toolbar, it displays produces an error in ConvertGridObject method. MissingMethodException. An exception of type 'System.MissingMethodException' occurred in System.Web.Extension.dll. Additional information: No parameterless constructor defined for the type of 'Sustem.String'.

property = {Syncfusion.JavaScript.Models.GridProperties ChildGrid}
property.PropertyType = {Name = "GridProperties" FullName = "Syncfusion.JavaScript.Models.GridProperties"}

How to resolve this error? I want to export all of the information in the nested grid to PDF. Thanks

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On May 20, 2016 04:27 AM

Hi Lory, 

We are unable to reproduce the issue while exporting the Grid after expanding the ChildGrid in the latest Essential Studio v14.1.0.46. But in the older v13.2.0.39, we are able to reproduce the issue. If you are using v13.2.0.39 and facing the serialization problem while exporting after expanding the ChildGrid, you can add childGrid to ignoreOnExport array in the load event of Grid. Refer to the following code example. 

<div id="Grid"></div> 
 
<script type="text/javascript"> 
    var employeeView = @Html.Raw(Json.Encode(ViewBag.empData)); 
    var OrdersView = @Html.Raw(Json.Encode(ViewBag.orders)); 
 
    $(function () { 
        $("#Grid").ejGrid({ 
            dataSource: employeeView, 
            allowPaging: true, 
             . . ..  
            load: function (args) { 
                this.addIgnoreOnExport("childGrid"); 
            }, 
           . . . . 
            childGrid: { 
        . . . . . 
            } 
        }); 
    }); 
</script> 

Also, let us know whether you would like to export the childGrid along with the parent Grid? 

If you are still facing same issue, please provide the following information to analyze the issue and provide you solution. 

1)      Essential Studio Version? 
2)      Code example of Grid as well as the code behind. 

Regards, 
Seeni Sakthi Kumar S. 


Lory
Replied On May 20, 2016 09:59 AM

I am using an older version. ej.web.all.min.js version 13.2.0.29 and I would like to export the childGrid along with the parentGrid. Sample code below is just one among the many nested grid that will have export to pdf feature. Please also consider some of the nested grids have multiple child grids.

[Javascript]
    $("#parentGrid").ejGrid({
        dataSource: parentSrc,
        query: new ej.Query().addParams("CompanyId", getCompanyId),
        allowPaging: false,
        allowSorting: true,
        allowTextWrap: true,
        allowFiltering: true,
        enableTouch: false,
        toolbarSettings: { showToolbar: true, toolbarItems: [ej.Grid.ToolBarItems.ExcelExport, ej.Grid.ToolBarItems.PdfExport ] },
        columns: [
           /*columns*/
        ],
        childGrid: {
            dataSource: window.ordersView,
            queryString: "EmployeeID",
            allowPaging: false,
            columns: [
                        /*columns*/
            ],
           
            load: function (args) {
                var proxy = this;
                this.model.query = new ej.Query();
                $.ajax({
                    url: "../Sample/GetDetail?&detailId=" + window.DetailID,
                    dataType: "json",
                    success: function (e) {
                        proxy.dataSource(e);
                    }
                });
            }
        },
        detailsExpand: function (args) {
            this.option("model.childGrid.dataSource", window.ordersView);
        },      
        toolbarClick: function (e) {
            this.exportGrid = this["export"];
            if (e.itemName == "Excel Export") {
                this.exportGrid('../Sample/ExcelExport')
                e.cancel = true;
            }           
            else if (e.itemName == "PDF Export") {
                this.exportGrid('../Sample/PDFExport')
                e.cancel = true;
            }
        },
    });

[Controller]

//PDFExport method gets data to pass to PdfDocumentExport


        [AcceptVerbs("POST")]
        public void PdfDocumentExport(IEnumerable Data, PdfDocument document, string fileName, string headerText = "", bool isAutoFit = true)
        {
            string gridModel = System.Web.HttpContext.Current.Request.Params["GridModel"];
            GridProperties gridProperty = ConvertGridObject(gridModel);
            PdfExport exp = new PdfExport();

            exp.Export(gridProperty, Data, fileName + ".pdf", false, false, "gradient-azure", false, false, document, headerText, isAutoFit);
        }

 //Grid Model conversion Method.
        private GridProperties ConvertGridObject(string gridProperty)
        {
            JavaScriptSerializer serializer = new JavaScriptSerializer();
            IEnumerable div = (IEnumerable)serializer.Deserialize(gridProperty, typeof(IEnumerable));
            GridProperties gridProp = new GridProperties();
            foreach (KeyValuePair<string, object> ds in div)
            {
                 var property = gridProp.GetType().GetProperty(ds.Key, BindingFlags.Instance | BindingFlags.Public | BindingFlags.IgnoreCase);
                    if (property != null)
                    {
                        Type type = property.PropertyType;
                        string serialize = serializer.Serialize(ds.Value);
                        object value = serializer.Deserialize(serialize, type);
                        property.SetValue(gridProp, value, null);
                    }               
            }
            return gridProp;
        }



Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On May 23, 2016 04:26 AM

Hi Lory, 

We don’t have support to export the Hierarchy Grid. We have already logged a Feature request for “Exporting Hierarchy Grid” and it can be implemented in any of our upcoming releases. But you can export the childGrid explicitly by including the export toolbarItem (“pdfExportor ej.Grid.ToolBarItems.PdfExport) in the toolbarItems (of toolbarSettings) for the childGrid as shown in the following code example. 

    <div id="Grid"></div> 
    <script type="text/javascript"> 
        $(function () { 
            $("#Grid").ejGrid({ 
                 . . . . 
                      . .. 
                childGrid: { 
                    dataSource: dataManger, 
                    queryString: "EmployeeID", 
                    toolbarSettings: { showToolbar: true, toolbarItems: [ej.Grid.ToolBarItems.PdfExport] }, 
                    toolbarClick: function (e) { 
                        if (e.itemName == "PDF Export") { 
                            this.exportGrid('/Home/ExportPdf') 
                            e.cancel = true; 
                        } 
                    }, 
                } 
            }); 
        }); 
    </script> 


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.

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.

;