1. Home
  2. Forum
  3. JavaScript - EJ 2
  4. Cannot replace html in export in expanded child grids

Cannot replace html in export in expanded child grids

Hi,

I previously asked the question how to replace html in the excel export of a grid...the solution was to implement excelQueryCellInfo on the grid to fire the function below...

Snippet
function exportQueryCellInfo(args) {
        args.value = args.value.replace(/(<([^>]+)>)/gi, ''); 
}

This works fine for the content of the parent grid. However, the content of the child grid cells do not get the html removed.

As a check I have updated the function so that every cell is prepended with an X and can see in the exported excel file that only the parent grid cells have the X prepended...as you can see below. Here you can also see the html still exists in the 'Next Step' column of the child grid.

So it seems the function isn't being called for the export of the child grid..even though it is specified on the childGrid as well as the parent grid. Is this a bug or is there something else I should be doing? I'm afraid I cannot provide the full grid code as it is very long and convoluted!

I look forward to receiving your help. Thanks

Adam Toone

Snippet
function exportQueryCellInfo(args) {
        args.value = args.value.replace(/(<([^>]+)>)/gi, ''); //here we strip out html tags from the cell content using replace() function. 
        args.value = 'X' + args.value;
}

The exported excel file:



The original grid:



9 Replies
PS Pavithra Subramaniyam Syncfusion Team October 18, 2021 11:45 AM UTC

Hi Adam, 

You can achieve your requirement by adding the ‘excelQueryCellInfo’ event to the Child Grid also. Please refer to the below code example and sample link for more information. 

var grid = new ej.grids.Grid({ 
  dataSource: employeeData, 
  toolbar: ['ExcelExport'], 
  excelQueryCellInfo: exportQueryCellInfo, 
  .  .  . 
  childGrid: { 
    excelQueryCellInfo: exportQueryCellInfo, 
 
    queryString: 'EmployeeID', 
    .  .  . 
  }, 
}); 
grid.appendTo('#Grid'); 
function exportQueryCellInfo(args) { 
  args.value = 'X' + args.value; 
} 



If you are still facing the issue, please share the below details that will be helpful for us to provide a better solution as early as possible. 

  1. Share the way how you bind ‘excelQueryCellInfo’ to the Child Grid
  2. Ensure whether the event hit for the Child Grid
  3. Share the Syncfusion version you are using

Regards, 
Pavithra S 


AT Adam Toone October 21, 2021 10:40 AM UTC

Hi,


Thanks for the reply..but unfortunately this does not seem to be working. I have even used a specific function to bind excelQueryCellInfo for the child grid and this never gets hit in the debugger. Below is an example of the child grid.


We are using syncfusion version 19.3.46 @ https://cdn.syncfusion.com/ej2/dist/ej2.min.js




RR Rajapandi Ravi Syncfusion Team October 22, 2021 01:13 PM UTC

Hi Adam, 

Thanks for the update 

Based on your shared information we have prepared a sample of Hierarchy Grid with Odatav4 adaptor and try to reproduce the problem, but it was unsuccessful. The excelQueryCellInfo event was triggered while exporting the excel document. Please refer the below code example and sample for more information. 

 
<script> 
    var data = new ej.data.DataManager({ 
        url: 'http://localhost:49442/Orders', 
        adaptor: new ej.data.ODataV4Adaptor(), 
        crossDomain: true 
    }); 
 
    var grid = new ej.grids.Grid({ 
        dataSource: data, 
        height: 450, 
        allowSorting: true, 
        toolbarClick: function (args) { 
            if (args.item.id === "Grid_Excel Export") { 
                grid.excelExport({ hierarchyExportMode: 'All' }); 
            } 
        }, 
        excelQueryCellInfo: exportQueryCellInfo, 
        allowPaging: true, 
        allowEditing: true, 
        allowExcelExport: true, 
        toolbar: ['Add', 'Edit', 'Delete', 'Update', 'Cancel', 'Excel Export'], 
        editSettings: { allowEditing: true, allowAdding: true, allowDeleting: true }, 
        columns: [ 
            { field: 'OrderID', isPrimaryKey: true, headerText: 'Order ID', width: 120 }, 
            { field: 'CustomerID', width: 140, headerText: 'Customer ID' } 
        ], 
        childGrid: { 
            dataSource: data, 
            excelQueryCellInfo: exportQueryCellInfoChild,  
            queryString: 'OrderID', 
            columns: [ 
                { field: 'Freight', headerText: 'Freight', width: 120, format: 'C2' }, 
                { field: 'ShipCity', headerText: 'Ship City', width: 120 } 
            ], 
        } 
    }); 
    grid.appendTo('#Grid'); 
    function exportQueryCellInfo(args) { 
        args.value = 'X' + args.value; 
    } 
    function exportQueryCellInfoChild(args) { 
       args.value = 'X' + args.value; 
    } 
</script> 
 


If you still face the issue, please replicate the issue with our above attached sample it will help us to provide the proper solution and also, we suspect that you are not binding excelQueryCellInfo event separately for child Grid, so please ensure you are bind the excelQueryCellInfo event properly for the child Grid. 

Rajapandi R 


AP Ashley Polkinghorn April 7, 2023 10:49 PM UTC

Hi!

I've been investigating a similar issue (maybe the same one Adam was seeing?), and it looks like the excelQueryCellInfo handler is not called on rows that are expanded. This can be reproduced in Pavithra's Stackblitz sample above (https://stackblitz.com/edit/s2hjx2?file=index.js ). Expand a row, and the exported spreadsheet's childGrid for that row will not have the prepended X in its cells.

This repros on newer builds, as well (I'm on 21.1.35).

The childGrid's properties (but not methods) get copied into grid.expandedRows. Later, DetailRow.getGridModel returns this copied object if it's available; otherwise it calls extend so the model has all the methods.

Thanks,

Ashley


RR Rajapandi Ravi Syncfusion Team April 10, 2023 01:20 PM UTC

Ashley,


We have modified your shared stackblitz sample and the excelQueryCellInfo event is getting triggered for the childGrid and prepended X in its cells. Please refer the below code example and sample for more information.


 

<script src="https://cdn.syncfusion.com/ej2/21.1.35/dist/ej2.min.js" type="text/javascript"></script>

<link rel='nofollow' href="https://cdn.syncfusion.com/ej2/21.1.35/material.css" rel="stylesheet">

 


Sample: https://stackblitz.com/edit/s2hjx2-9lqyga?file=index.html,index.js


AP Ashley Polkinghorn April 10, 2023 05:34 PM UTC

Thanks for your quick reply! I think my description meandered a bit - I'm talking only about childGrids that are expanded - can you double-check these steps in your sample? 

Steps: 

1. In the grid, click the triangle to expand at least one row (in my example below, Employee #2 (Andrew)).

2. Click export

Observe that the cells of the expanded childGrid (in my example, Andrew's rows - 10250 and 10261) don't have the prepended X.

sfGridPrepend_Grid.png


sfGridPrepend_Exported.png


RR Rajapandi Ravi Syncfusion Team April 12, 2023 01:20 PM UTC

Ashley,


We have confirmed and logged this as a bug in the component. So, we have considered ” ExcelQueryCellInfo event is not getting triggered for childGrid when the parent is expanded” as a defect and logged a report for the same. We will include the defect fix in any of our upcoming patch release.


You can now track the current status of your request, review the proposed resolution timeline, and contact us for any further inquiries through this link.


Feedback link : https://www.syncfusion.com/feedback/42828/excelquerycellinfo-event-is-not-getting-triggered-for-childgrid-when-the-parent-is



EB Electa Baker April 25, 2023 07:05 PM UTC

Has anyone found a work-around for this issue?


RR Rajapandi Ravi Syncfusion Team May 10, 2023 12:16 PM UTC

Ashley/Electa,

We are glad to announce that, we have included the fix for the issue “ExcelQueryCellInfo event is not getting triggered for childGrid when the parent is expanded” in our volume 1 release (21.2.4). So please upgrade to our latest version of Syncfusion NuGet package to resolve the reported issue.


Feedback: https://www.syncfusion.com/feedback/42828/excelquerycellinfo-event-is-not-getting-triggered-for-childgrid-when-the-parent-is


Release Notes: https://ej2.syncfusion.com/documentation/release-notes/21.2.4/?type=all#grid

  

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance.



Loader.
Up arrow icon