Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

Microsoft.JSInterop.JSException: 'Cannot read properties of undefined (reading 'closest') Blazor


Any new page that I add outside of the ones that the template already has, throws me that error, do I have to modify a specific file? this error happens in MasterInit.razor

Stack
Microsoft.JSInterop.JSException: 'Cannot read properties of undefined (reading 'closest')
TypeError: Cannot read properties of undefined (reading 'closest')
at _getItemParentElement (http://localhost:5170/assets/js/scripts.bundle.js:1938:24)
at _getItemParentElements (http://localhost:5170/assets/js/scripts.bundle.js:1959:22)
at _setActiveLink (http://localhost:5170/assets/js/scripts.bundle.js:2251:27)
at KTMenu.the.setActiveLink (http://localhost:5170/assets/js/scripts.bundle.js:2406:16)
at KTMenu.updateByLinkAttribute (http://localhost:5170/assets/js/scripts.bundle.js:2657:26)
at http://localhost:5170/_framework/blazor.server.js:1:3501
at new Promise (<anonymous>)
at kt.beginInvokeJSFromDotNet (http://localhost:5170/_framework/blazor.server.js:1:3475)
at http://localhost:5170/_framework/blazor.server.js:1:72054
at Array.forEach (<anonymous>)'

Regards


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)


Hi,

Unfortunately, we are not able to reproduce this error. If there are any steps on how to reproduce it please describe them.

To add a new page you can do the steps below:


  1. Create you page .razor component inside Starterkit/Pages folder.

  2. Place line @page "/your-page-route" on the top of you file.

  3. Then add your page view markup.



Example of file:

@page "/your-page-route"

<h1>You page content</h1>


Regards,
Lauris Stepanovs,
Keenthemes Support Team

I think the problem is not in the new page, but in the SideBarMenu.
In the blazor template, in MasterInit, KTMenu.updateByLinkAttribute is invoked in order to highlight the menu link corresponding to the page you have created.
The inside code assumes the link is inside an accordion, I guess, and tries to expand it.
If that menu is not inside an accordion, in the same way the sample renders it, you have an exception.
Digging a little deeper I think this could depend on menu.setActiveLink(link);

I'm not able to debug it,


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(