MaterializeCSS modal not working in rails - ruby-on-rails-4

Question

I'm trying to make a modal form pop up to add a new comment.
HTML Snippet
Add Comment
<div id="add_ac" class="modal">
<div class="modal_content">
<%= render '/s_comments/form' %>
</div>
</div>
I'm trying to use the link to trigger the modal
This is in the javascript file for the model (admin.js)
$('.modal-trigger').leanModal({
dismissible: true
});
According to the materialize css documentation that should work.
The following is in the headers for my application.js file
//= require jquery2
//= require jquery_ujs
//= require turbolinks
//= require materialize-sprockets
//= require_tree .
Thank you.

Answer 1

You need to initialize materialize modals within your document ready function:
$(document).ready(function(){
// the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered
$('.modal-trigger').leanModal();
});
After this they should show up.
Still you need to make your rails form ready for the modals, I found a guide for this here: http://www.jetthoughts.com/blog/tech/2014/08/27/5-steps-to-add-remote-modals-to-your-rails-app.html

Answer 2

I know this question is really old, but I wanted to share just in case someone else was running into this problem.
If you are using TurboLinks (which is standard in Rails) then the javascript that attaches listeners to buttons needs to go in the body instead of the head of the document. TurboLinks replaces the body only so when you load a new page, the javascript doesn't get run again.

Answer 3

You are initializing a modal class of "modal-trigger",
$('.modal-trigger').leanModal({
dismissible: true
});
but you are not calling / referencing the class in your anchor tag
Add Comment
so you just need to add "modal-trigger" in your anchor tag
Add Comment
and it should work, also I don't know why you are using data-toggle.