How to get Foundation Reveal Modal working in Rails?

Question

I am trying to get the Foundation Reveal Modal working in my rails application. I have followed the example on the Foundation website:

http://foundation.zurb.com/sites/docs/v/5.5.3/components/reveal.html

<a href="#" data-reveal-id="myModal">Click Me For A Modal</a>

<div id="myModal" class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
  <h2 id="modalTitle">Awesome. I have it.</h2>
  <p class="lead">Your couch.  It is mine.</p>
  <p>I'm a cool paragraph that lives inside of an even cooler modal. Wins!</p>
  <a class="close-reveal-modal" aria-label="Close">&#215;</a>
</div>

On button click nothing happens.

js (don't know if this is correct...)

<script>
  $('#myModal').foundation('reveal', 'open');
</script>

application.js

    //= require jquery
    //= require jquery_ujs
    //= require jquery.turbolinks  
    //= require turbolinks
    //= require list
    //= require foundation
    //= require foundation-datepicker
    //= require responsive-tables
    //= require jquery.reveal
    //= require list.fuzzysearch
    //= require_tree .

I downloaded the reveal js and css files to my local app. I guess it's js where I am tripping up here. Any suggestions? Thanks.

Answer 1

Your code looks correct. Do you have the call to foundation at the bottom of your page?

<script>
    $(document).foundation();
</script>

Can you point us to an online version of your page?