Zurb Foundation 5 toggle-topbar not working

Question

Just switched my rails project to test Zurb Foundation 5 and now the toggle-topbar menu is not working.

When the viewport is small, the top bar menu items disappear and the menu icon is displayed as before, but when I click on the menu icon nothing occurs.

I have the following code to display a top-bar menu.

<nav class="top-bar">
  <ul class="title-area">
    <li class="name"></li>
    <li class="toggle-topbar menu-icon">
      <a>{href: "#"}
        <span>Menú</span></a>
    </li>
  </ul>
  <section class="top-bar-section">
    <ul class="left">
      <li>
        <a class="i fi-home">{href: "/ui/home"}
          &nbsp;Inicio</a></li>
      <li>
        <a>{href: "/ui/wine_reviews"} Críticas de Vinos</a></li>
      <li>
        <a>{href: "/ui/wine_tastings"} Catas y Maridajes</a></li>
      <li>
        <a>{href: "/ui/blogs"} Noticias</a></li>
    </ul>
    <ul class="right">
      <li>
        <a>{href: "#"}
          <i class="fi-lock"></i>
          &nbsp;Club TastaVi</a></li>
    </ul>
  </section>
</nav>

It's a top-bar menu contained in my grid.

Answer 1

I had the same problem with the top bar. After comparing zurbs code with mine I noticed the difference.

<nav class="top-bar" data-topbar>

I was missing the data-topbar. After adding that mine topbar started working correctly.