0

When I use ternary operator to update value of nextEvent, the code looks like this and works fine

var open = document.getElementById("openNav")
var close = document.getElementById("closeNav")
var events = {
    menuOpened : "menu opened",
    menuClosed : "menu closed",
};
var nextEvent = events.menuOpened;

const toggleNav = () => {
    console.log(nextEvent);
    nextEvent = nextEvent==events.menuClosed?events.menuOpened:events.menuClosed;
    open.classList.toggle("hide");
    close.classList.toggle("hide");
};
<nav class="nav-wrapper" id="navWrapper">
    <div class="toggle-nav" id="openNav" onclick="toggleNav()">
        <img src="menu_52px.png" alt="menu" />
    </div>
    <div class="toggle-nav hide" id="closeNav" onclick="toggleNav()">
        <img src="close_52px.png" alt="menu" />
    </div>
</nav>

But I'm trying to input the JSON property name as string at the onclick listener in the html portion. But this does not works.

var open = document.getElementById("openNav")
var close = document.getElementById("closeNav")
var events = {
    menuOpened : "menu opened",
    menuClosed : "menu closed",
};


const toggleNav = (event) => { //changed line
    console.log(events.event); //changed line
    open.classList.toggle("hide");
    close.classList.toggle("hide");
};
<nav class="nav-wrapper" id="navWrapper">
    <div class="toggle-nav" id="openNav" onclick="toggleNav('menuOpened')"> /* changed line */
        <img src="menu_52px.png" alt="menu" />
    </div>
    <div class="toggle-nav hide" id="closeNav" onclick="toggleNav(menuClosed)"> /* changed line */
        <img src="close_52px.png" alt="menu" />
    </div>
</nav>

Even if I use events[event], the problem remains. I think that my approach to the problem is mistaken or something else. Please suggest solutions to this problem.

  • There is no JSON in your question, what you have is just an object. JSON is a *textual notation* for data exchange. [(More here.)](http://stackoverflow.com/a/2904181/157247) If you're dealing with JavaScript source code, and not dealing with a *string*, you're not dealing with JSON. – T.J. Crowder Apr 17 '21 at 08:09
  • I made a mistake in questioning, sorry Its object –  Apr 17 '21 at 08:10
  • I want to toggle navbar, and log it every time. So i want to pass object property as a parameter for the toggleNav function. But it does not work since it's treating it as a string –  Apr 17 '21 at 08:14

0 Answers0