Как перерегистрировать общие события JavaScript в Rails после Ajax-запроса

Question

Я пишу приложение Rails, которое включает в себя функциональность ajax с использованием jQuery. Я надеюсь, что вы, ребята, могли бы помочь мне здесь.

Например, в моем /public/javascripts/application.js:

/* application.js */
...

$('.item-edit').editable('/item/update', {
    name  : $(this).attr('name'),
    id   : $(this).attr('id'),
    cancel  : 'Cancel',
    submit  : 'OK',
    indicator         : 'Saving...',
    tooltip  : 'Click to edit...',
    method  :  'put',
    submitdata          :  {attribute : "name"}
  });

С помощью плагина jEditable этот код связывает зарегистрированные элементы для встроенного редактирования.

Допустим, у меня есть партиал в app / views / shared / _item_info.html.erb

<!-- _item_info.html.erb -->
...
<li class="item-edit" id="<%= item.id %>"><%= item.name %> </li>
...

При первой загрузке, когда нажимаются какие-либо элементы item-edit, пользователю будет показано встроенное текстовое поле с кнопкой «Ok». При нажатии кнопки «ОК» отправляется запрос «PUT», в результате чего этот текст сохраняется. После того, как этот текст был сохранен в БД, мы отобразим новый текст, вызвав партиал:

Вот так выглядит мой файл update.js.erb:

/* update.js.erb */
...
$("#items").html("<%= escape_javascript(render('shared/item_info')) %>")

$('.item-edit').editable('/item/update', {
    name  : $(this).attr('name'),
    id  : $(this).attr('id'),
    cancel  : 'Cancel',
    submit  : 'OK',
    indicator : 'Saving...',
    tooltip  : 'Click to edit...',
    method  :  'put',
    submitdata  :  {attribute : "name"}
});
...

Возможно, вы заметили, что мне нужно перерегистрировать мои элементы, чтобы включить встроенное редактирование, если нет, то нажатие на элементы ничего не изменит. Моя проблема в том, что я перерегистрирую другие события в других запросах, например, в create.js.erb, что вызывает массовое дублирование кода.

Есть ли решения этой проблемы? Есть ли способ, где я мог бы поместить все свои обычные коды перерегистрации событий в один файл .js и включить его в create.js.erb, update.js.erb ... чтобы все мои события были перерегистрированы без меня, чтобы скопировать / вставить код?

Извините за скучность. Буду признателен за любую помощь, которую я могу получить.

Answer 1

jQuery предоставляет замечательный метод для этого .live (docs: http://api.jquery.com/live/)

Однако, поскольку вы используете плагин и вызываете .editable для выполнения привязки, вам придется изменить источник jEditable, чтобы использовать .live соответствующим образом, что может (или не может) быть больше работы, чем стоит.

На самом деле, похоже, есть и другие очень похожие вопросы:

jeditable live ()

Создание JEditable для работы с новыми элементами (.live)

но ни у одного нет идеального решения, но стоит проверить

Answer 2

Я придумала решение, которое не очень красиво, но помогает устранить дублирование кода прямо сейчас.

Я только что добавил это в своей части:

<!-- _item_info.html.erb -->
...
<li class="item-edit" id="<%= item.id %>"><%= item.name %> </li>
...
<% javascript_tag  do -%>
    $('.item-edit').editable('/item/update', {
        name  : $(this).attr('name'),
        id  : $(this).attr('id'),
        cancel  : 'Cancel',
        submit  : 'OK',
        indicator : 'Saving...',
        tooltip  : 'Click to edit...',
        method  :  'put',
        submitdata  :  {attribute : "name"}
    });
...

Мне больше не нужно регистрироваться в моих файлах .js.erb.