Есть сайт на рельсах и навигация по сайту полностью на jquery без перезагрузки страниц(не знаю хорошо это или плохо). Все работает, но не так как хотелось бы, код я писал по мере изучения самого языка.
Есть меню(заказы, магазин..) с активным "remote: true"
link_to order_index_path, remote: true
link_to shop_index_path, remote: true
... или тоже самое, но в цикле:
- menu.each do |m|
- if ((m.parent == 0) && (can? :read, m.access.constantize))
= link_to eval(m.link), remote: true do
.menu-btn = m.title
В каждом "index.js" присутствует определенный jQuery(ajax) код:
$("#main_content").html("<%= j (render 'index') %>")
...
$(#somebutton).click(function(){
console.log('help')
})
...
Если я перехожу на нужную мне вкладку используя меню (link_to order_index_path, remote: true
), то все работает(логично что подключается index.js
), но если перезагрузить страницу, то jQuery код не работает. Мне приходится дублировать код и прописывать его в coffee script или в application.js
Подобная ситуация встречается везде.
Например, мне нужно создать новый заказ, для этого я использую модальное окно (с использованием "slide" эффекта) и когда заказ создан, то в create.js
отрисовывается только сама таблица, а не index
<% if !@order.errors.empty? %>
...
<% else %>
$(".panel .panel-body").html("<%= j (render "ordertable") %>")
$("#product-modal").modal("hide")
<% end %>
Возвращаясь к началу, jQuery код с $(#somebutton).click
в order_index_path
после срабатывания create.js
так-же перестает работать. Далее в create.js
мне снова приходится дублировать то же самое действие.
И на выходе мы получаем дубликат уже в 3-х вьюхах: index.js
, coffeescript(application.js)
и собственно в create.js(update.js)
Как быть? Как мне все это оптимизировать?
Обновление
Как я написал выше, все работает. Мне хочется оптимизировать код. Я не считаю правильным копировать один и тот же эвент во все вьюхи, которые связаны с index-ами. Как же DRY? При переходе по ссылке подгружается index.js
, при перезагрузке страниц подгружается coffee
и application.js
, но не используется index.js
и наоборот. Можно как нибудь обойтись например только coffee
?
require
. т.к у вас динамически обновляется контент, используйте события следующим образом$(document).on('event_name', '.element', function() { });
и это достаточно выполнить при начальной инициализации