Filter popup broken since new update

[Benjamin Malin]

Since my team installed the latest versions of Syncfusion and React Grids, our filters no longer work. When we click the filter icon for any column in the header, we get the following error:

dialog.js:389 Uncaught TypeError: Cannot read property 'insertBefore' of null

    at Dialog../node_modules/@syncfusion/ej2-popups/src/dialog/dialog.js.Dialog.initRender (dialog.js:389)

    at Dialog../node_modules/@syncfusion/ej2-popups/src/dialog/dialog.js.Dialog.render (dialog.js:121)

    at Dialog../node_modules/@syncfusion/ej2-base/src/component.js.Component.appendTo (component.js:134)

    at CheckBoxFilterBase../node_modules/@syncfusion/ej2-grids/src/grid/common/checkbox-filter-base.js.CheckBoxFilterBase.showDialog (checkbox-filter-base.js:229)

    at CheckBoxFilterBase../node_modules/@syncfusion/ej2-grids/src/grid/common/checkbox-filter-base.js.CheckBoxFilterBase.openDialog (checkbox-filter-base.js:249)

    at CheckBoxFilter../node_modules/@syncfusion/ej2-grids/src/grid/actions/checkbox-filter.js.CheckBoxFilter.openDialog (checkbox-filter.js:29)

    at Filter../node_modules/@syncfusion/ej2-grids/src/grid/actions/filter.js.Filter.filterDialogOpen (filter.js:518)

    at Filter../node_modules/@syncfusion/ej2-grids/src/grid/actions/filter.js.Filter.openMenuByField (filter.js:893)

    at Filter../node_modules/@syncfusion/ej2-grids/src/grid/actions/filter.js.Filter.filterIconClickHandler (filter.js:909)

    at Observer../node_modules/@syncfusion/ej2-base/src/observer.js.Observer.notify (observer.js:99)

No other changes to our code have taken place. For reference, we have ej2-base, ej2-data, ej2-react-buttons, ej2-react-charts, ej2-react-grids, and ej2-react-inputs installed

[Balaji Sekar]

Hi Benjamin, 

 

Thanks for your contacting us. 

 

We have considered this as a breaking issue with high priority at our end. Also we have already included the fix same version(17.4.47) and refreshed the packages. So we suggest you to update the Syncfusion packages again to resolve the issue. 

 

Please find the below sample for your reference which has been referred to latest version(17.4.47). 

 

Sample: https://stackblitz.com/edit/react-excel-filter-latest?file=index.js 

 

If you are facing any issues, while updating Syncfusion packages, please follow the below steps. 

 

1.           Delete package.lock.json file from your application. 

2.           Remove the @syncfusion  package folder from the node_modules. 

3.           Use latest and same version for components(Grid, etc) in package.json file. 

4.           Then install the new packages. 

 

Documentation: https://ej2.syncfusion.com/react/documentation/common/how-to/update-npm-package/ 

 

Regards, 

Balaji Sekar.