MaterializeCSS modal не работает в рельсах

Я пытаюсь создать модальную форму, чтобы добавить новый комментарий.MaterializeCSS modal не работает в рельсах

HTML Отрывок

<a href="#add_ac" data-toggle="modal" class="waves-effect waves-light blue accent-2 white-text btn">Add Comment</a> 

<div id="add_ac" class="modal"> 
    <div class="modal_content"> 
    <%= render '/s_comments/form' %> 
    </div> 
</div>

Я пытаюсь использовать ссылку, чтобы вызвать модальную

Это в файл JavaScript для модели (admin.js)

$('.modal-trigger').leanModal({ 
    dismissible: true 
    });

Согласно материализующей документации css, которая должна работать.

Ниже в заголовках для моего application.js файла

//= require jquery2 
//= require jquery_ujs 
//= require turbolinks 
//= require materialize-sprockets 
//= require_tree .

Спасибо.

источник

2015-08-09 jabbajac

Вы должны инициализировать материализовать модальности в пределах вашего документа готовой функции:

$(document).ready(function(){ 
    // the "href" attribute of .modal-trigger must specify the modal ID that wants to be triggered 
    $('.modal-trigger').leanModal(); 
    });

После этого они должны показать.

Тем не менее вы должны сделать ваши рельсы образуют готовы к модальностей, я нашел руководство для этого здесь: http://www.jetthoughts.com/blog/tech/2014/08/27/5-steps-to-add-remote-modals-to-your-rails-app.html

источник

2015-09-17 10:34:54

Я знаю, что этот вопрос действительно старый, но я хотел бы поделиться только в случае, если кто-то еще был запущен в эту проблему.

Если вы используете TurboLinks (что стандартно в Rails), то javascript, который прикрепляет слушателей к кнопкам, должен идти в теле, а не в голове документа. TurboLinks заменяет тело только тогда, когда вы загружаете новую страницу, javascript не запускается снова.

источник

2016-02-27 16:14:29 kingcoin

Означает ли это, что мне нужно включить отдельный файл js и загрузить его в тело? Я все еще довольно новичок в рельсах и как много активов обрабатывается. – jabbajac

@jabbajac Мне просто нужно было включить js MuteMinute, размещенный ниже. Вы можете включить его в другой файл, но я просто поместил его в представление с помощью тега javascript. Я не знаю, является ли это всего лишь тегом HAML или работает в ERB тоже. – kingcoin

Вы инициализация модального класса "модального-триггер",

$('.modal-trigger').leanModal({ 
dismissible: true

});

но вы не зовем/ссылки на класс в вашем якорный тег

<a href="#add_ac" data-toggle="modal" class="waves-effect waves-light blue accent-2 white-text btn">Add Comment</a>

так что вам просто нужно добавить «модальный-триггер» в вашем якорный тег

<a href="#add_ac" data-toggle="modal" class=" modal-trigger waves-effect waves-light blue accent-2 white-text btn">Add Comment</a>

и он должен работать , также я не знаю, почему вы используете переключение данных.

источник

2016-06-14 00:31:44 Wil

MaterializeCSS modal не работает в рельсах

ответ

Смежные вопросы