Dropdown taking long time to show 37K rows in wijmo grid

Posted by: chandra.malla on 9 January 2023, 12:52 am EST

  • Posted 9 January 2023, 12:52 am EST

    Hi Team,

    We have an api which loads 37000 rows. W are trying to show this data in wijmo grid cell dropdown. Dropdown is able to handle for small data. But, taking long time to load this huge data. Please suggest an approach to get this done.

  • Posted 9 January 2023, 6:30 pm EST


    To avoid this issue, you can use the ‘ComboBox’ control as an editor for the flexGrid column, and set it’s ‘virtualizationThreshold’ property to a small number like 100, to enable virtualization.

    Please refer to the following sample for its implementation - https://stackblitz.com/edit/js-gyimto?file=index.js


  • Posted 10 January 2023, 4:21 pm EST

    Hi Vivek,

    Thank you for the solution. But, still it is taking around 3 mins to display the dropdown. Am I need to do anything else here?










    (lostFocus)=“lostFocus(combo, wijmoHeader)”


    Thanks & Regards,


  • Posted 11 January 2023, 4:11 pm EST


    Sorry, but we are unable to replicate the issue on our end, can you please share a small sample replicating your issue, on which we can investigate and assist you accordingly?

    You can also update the following sample to replicate your issue and share with us - https://stackblitz.com/edit/angular-dzgiij?file=src/app/app.component.html


  • Posted 22 January 2023, 5:30 pm EST

    Hi Vivek,

    Sorry for the late. I’m able to reproduce the scenario in stackblitz. Please check it https://stackblitz.com/edit/angular-p3rjag?file=src%2Fapp%2Fapp.component.html.

    Added a new column ‘country1’ to the table. When you click on the drop drown, the page gets hanged.

    Please let me know if you need anything else.

  • Posted 23 January 2023, 5:51 pm EST


    It seems that you are using the comboBox inside the cell template, which is causing this issue. It seems to be a bug so we have forwarded this issue to the dev team for further investigation with internal tracking id - WJM-25872. We will update you as soon as we have an update from the dev team. Meanwhile, to prevent this you can avoid using the ComboBox inside the cell template and use it as an editor for the column by assigning it to the columns ‘editor’ property.

    In case, you want to remove the dropdown arrow from the grid cell, then you can set the ‘showDropDown’ property of the flexGrid to false. Now the dropdown button will only be visible in the edit mode.

    Please refer to the following sample for the same - https://stackblitz.com/edit/angular-sr6kog?file=src/app/app.component.html


Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels