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

Opening dialog with dynamic content is throwing an error of "Cannot read property 'matrix' of undefined" (EJS)


I'm working with dialog and dynamic content, but it is throwing an error of "Cannot read property 'matrix' of undefined" when the dialog is showed and affects, for example, my bootstrap menu that no longer open due to this error until I refresh the page. 

The general functionality of dialog is fine, only that this error causes errors in other places. Any idea how to fix this or the correct order to open/prepare the dialog with dynamic content?

Also, I have tested with static content and it does not generate that error. I think is something related to the dynamic content.

I attached the view that have this functionality.

Let me know if you need something extra.


Attachment: Index_3feac701.zip

5 Replies

VK Vinoth Kumar Sundara Moorthy Syncfusion Team July 18, 2019 06:48 AM

Hi Daniel, 
Good day to you. 
We have validated your issue with your use case scenario and we are able to reproduce it while updating dialog content in dynamic manner. For your reference we have prepared a sample to load the remote JSON data and the same can be downloaded from below link, 
Could you please check the above sample and get back to us with more details (like complete code snippet for Grid and Dialog) if you still face the issue in your end? 
Vinoth Kumar S 

DA Daniel July 18, 2019 10:57 AM

Hi Vinoth,

I tried the code that you attached and its works fine if we load a remote JSON data.

I added to this solution the thing that I want to do, and I was able to reproduce the issue that I have related to the bootstrap menu after opening and closing the Dialog with Grid inside. Curiously the error of "Cannot read property 'matrix' of undefined" does not appear, so it is not related to the bootstrap error.

  • You can run the project and reduce the screen until the options from menu are hidden:

  • Open and close the menu to verify it's working

  • Click the button that opens the dialog

  • You can interact with the Grid inside the Dialog without problem, after that... you can close the dialog.
  • Test from the main page to open and close again the menu --> You will detect that the menu cannot be closed (this is my issue in my current project)
Thanks, regards!

Attachment: EJ2MVC_IncludedMyFunctionality_564590c4.zip

PO Prince Oliver Syncfusion Team July 19, 2019 06:11 AM

Hi Daniel 

Thanks for your update. 

Issue-1: Bootstrap navigation menu is not working properly, once after closed the dialog.
We were able to reproduce your issue from the shared sample. The reported issue is due to duplication of Jquery and bootstrap scripts and relevant imports in both _LayoutNoMenu.cshtml and _Layout.cshtml pages. We suggest you to remove relevant scripts from _LayoutNoMenu.cshtml.


Issue-2: Script error throws, while loading content to dialog in dynamic manner. 
We have checked that the reported issue is due to the delay occurred while loading content to grid. Actually grid control tries to focus the grid cell before the content loading in it. To avoid this script error please remove tabIndex attribute in Created event of grid control.  


For your reference we have modified the shared sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/EJ2MVC1311329441  


DA Daniel July 19, 2019 09:11 AM

Thanks for the solutions! Those work perfectly,


NP Narayanasamy Panneer Selvam Syncfusion Team July 22, 2019 04:58 AM

Hi Daniel, 
Most welcome. we are glad that the issue is resolved in your end. 
Narayanasamy P. 

Live Chat Icon For mobile
Up arrow icon