Вызов функции CoffeeScript во всех представлениях (Ruby on Rails)

Question

это мой первый вопрос StackOverflow, поэтому я надеюсь, что я попрошу его правильно!

У меня есть веб-приложение Ruby on Rails, где в наших файлах javascript у меня есть следующий код CoffeeScript, который определяет, когда нажата кнопка с id = "submit", а затем прокручивается до первой ошибки, которая появляется, если она есть (кнопки «Submit» используются в наших формах):

@scroll_to_error = -> 
 
    document.getElementById('submit').onclick = -> 
 
    \t if $('.alert-danger:visible:first').length > 0 
 
     $('html, body').animate { scrollTop: $('.alert-danger:visible:first').offset().top - 220 }, '1000' 
 
    \t return

Я файл включен в наш файл application.rb в папке конфигурации, так что его можно назвать в какой-либо HTML-файл в разделе представлений ~~ однако, мне было интересно, есть ли способ, чтобы он мог быть во всех взглядах, которые у меня есть. Есть ли определенный способ сделать это?

Надеюсь, этого недостаточно. Извините, я не мог предоставить больше фрагментов кода, поскольку я кодирую компанию (отсюда и «наш»).

Answer 1

Попробуйте что-нибудь вроде этого?

scrollToError = -> 
    $('*[data-scroll-to-error="true"]').click -> 
    alertElement = $('.alert-danger:visible:first') 

    if alertElement.length > 0 
     $('html, body').animate { 
     scrollTop: alertElement.offset().top - 220 
     }, '1000' 

# Run with turbolinks. 
$(document).on 'page:change', scrollToError 

и кнопку отправки с атрибутом data-scroll-to-error набора.

<input type="submit" data-scroll-to-error="true" /> 

Я нахожу это заявление твоего запутанным:

Я файл, включенный в наш файл application.rb в папке конфигурации , так что он может быть вызван в любой HTML-файл в разделе просмотров

Предполагая, что это стандартный проект Rails, вы должны быть включены в файл, содержащий код CoffeeScript в assets/javascripts/application.js (в manif est), а так как application.js - это файл JS, необходимый в макете (не так ли? : - /), этот код будет выполняться во всех ваших представлениях. Я не вижу, как здесь участвует config/application.rb.

Обновление: Добавление дополнительной информации.

Если вы не уверены в том, как использовать файл application.js (файл манифеста), найдите время, чтобы просмотреть официальную документацию Rails (особенно раздел о манифестах).

http://guides.rubyonrails.org/asset_pipeline.html#manifest-files-and-directives

В вашем случае, вы хотите изменить application.js включать:

... 
//= require error 
... 

В принципе, вы перечислить все файлы ресурсов, которые вы хотите загружены вместе со всеми страницами, которые используют макет (возможно, application.html.erb), а затем укажите только файл манифеста. Таким образом, Rails может объединить и минимизировать, чтобы сгенерировать отдельный файл актива. Файлы манифеста по умолчанию application. автоматически предварительно скомпилированы - так что вам не нужно вручную добавлять новые ресурсы в список прекомпиляции.

Причина, по которой я написал селектор как *[data-scroll-to-error="true"], был личным предпочтением - код читается лучше для меня таким образом. Если вы уверены, что ID submit будет (и будет в будущем) применяться только к элементам, для которых требуется прокрутка до ошибки, тогда это нормально, чтобы изменить первый селектор на $('#submit').click ->

Answer 2

Один из способов сделать это - выставить свой код в функции, чтобы вы могли вызывать его из представлений.

CoffeeScript файл:

window.SomeNamespace ||= {} 
window.SomeNamespace.scroll_to_error = -> 
    document.getElementById('submit').onclick = -> 
    if $('.alert-danger:visible:first').length > 0 
     $('html, body').animate { scrollTop: $('.alert-danger:visible:first').offset().top - 220 }, '1000' 

Просмотр файла: (скажем, вы используете эрб)

<script> 
    $(function(){ 
    window.SomeNamespace.scroll_to_error() 
    }); 
</script> 

Лучший способ сделать это, однако, отделить вид кода и javascript-код. elementaljs предлагает небольшую библиотеку поведения JavaScript для Rails, которую мне очень нравится. Вы можете «прикрепить» поведение javascript к определенному элементу html через атрибут data, и библиотека делает это выше для вас.