Level 102
And where is the code for opening it? I see you stop the browser event but you do nothing after that
Feb 5, 2022
7
Level 2
Inertia & ReactJS toggle dropdown menu works only once
Am using e.stopPropagtion() to prevent Inertia form following a link of sidebar toggle menu. The menu opens first time I click on the link for example component, the components is loaded as expected. The problem is that the menu closes after the component is loaded and I can't open the it again. See code snippet below:
<div className="sidebar-menu">
<ul id="accordion-menu">
<li className="dropdown">
<Link className="dropdown-toggle no-arrow" href="/"><span className="fa fa-home"></span><span className="mtext">Home</span></Link>
</li>
<li className="dropdown">
<a href="#" onClick={e => e.nativeEvent.stopPropagation()} className="dropdown-toggle">
<span className="fa fa-table"></span><span className="mtext">Menu</span>
</a>
<ul className="submenu">
<li><Link href="/example">Example</Link></li>
<li><a href="#">Menu Item 1</a></li>
<li><a href="#">Menu Item 2</a></li>
</ul>
</li>
</ul>
</div>
Sidenote: Am using DeskApp admin template
Level 2
@Sinnbeck The code is part of the template's jQuery.
Level 102
@kenprogrammer oh I was confused when you asked for help with react. Using it mixed with jquery might be tricky due to the virtual dom. Good luck :)
Level 2
@Sinnbeck Do I need to trigger that code? Originally this is what was on achor tag
javascript:;
If I put it react complains with errors thus I put # instead
Level 2
@Sinnbeck Is there way out coz I need to use the admin template?
Level 102
@kenprogrammer I would rip out the html and drop the jquery. Or just use the template with pure jquery as it was intended
I have never tried getting jquery together with react, but I would image it would lead to alot of ideas and they will fight over which of them controls the dom
1 like
Level 2
@Sinnbeck Waah It tricky coz am not so much of a frontend dev
Please or to participate in this conversation.