Лучший способ добавить страницу конкретного JavaScript в приложение Rails 3?



Rails 3 имеет некоторый ненавязчивый JavaScript, который довольно крут.



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



например, где я мог уже сделал:



<%= f.radio_button :rating, 'positive', :onclick => "$('some_div').show();" %>


Теперь мы можем сделать его ненавязчивым с чем-то вроде



<%= f.radio_button :rating, 'positive' %>

# then in some other file
$('user_rating_positive').click(function() {
$('some_div').show();
}


поэтому я предполагаю, что мой вопрос заключается в том, где / как включить этот JavaScript? Я не хочу, чтобы заполнить application.js файл, потому что это JavaScript только применимо к этой одной точке зрения. Должен ли я каким-то образом включать пользовательский файл JavaScript для каждой страницы или вставлять его в переменную экземпляра, которую ищет заголовок?

740   10  

10 ответов:

то, что я хотел бы сделать, это включить Javascript для каждого вида в content_for :head блок, а затем yield к этому блоку в макете приложения. Например

если это довольно коротко, то:

<% content_for :head do %>
  <script type="text/javascript">
    $(function() {
      $('user_rating_positve').click(function() {
        $('some_div').show();
      }
    });
  </script>
<% end %>

или, если больше, то:

<% content_for :head do %>
  <script type="text/javascript">
    <%= render :partial => "my_view_javascript"
  </script>
<% end %>

затем, в файле layout

<head>
  ...
  <%= yield :head %>
</head>

если вы хотите включить javascript только на одной странице, вы можете включить его на странице inline, конечно, однако если вы хотите сгруппировать свой javascript и воспользоваться конвейером активов, уменьшенным js и т. д., Это можно сделать и иметь дополнительные активы js, которые объединяются и загружаются только на определенных страницах, разделяя js на группы, которые применяются только в определенных контроллерах/представлениях/разделах сайта.

переместите js в активы в папки с отдельным манифестом файл для каждого, поэтому, если у вас есть библиотека JS admin, которая используется только на бэкэнде, вы можете сделать это:

  • активы
    • javascripts
      • admin
        • ...js
      • admin.js (манифест для группы администраторов)
      • приложение.js (манифест для глобальной группы приложений)
      • глобальные
        • ...js

в существующее приложение.js

//= require jquery
//= require jquery_ujs
//= require_tree ./global // requires all js files in global folder

в новом админ.JS manifest file

//= require_tree ./admin // requires all js files in admin folder

убедитесь, что этот новый манифест js загружен путем редактирования конфигурации/производства.РБ

config.assets.precompile += %w( admin.js )

затем настроить макет страницы, так что вы можете включить некоторые дополнительные js для заголовка страницы:

<%= content_for :header %>   

затем в представлениях, где вы хотите включить эту конкретную группу js (а также обычную группу приложений) и/или любую конкретную страницу js, css и т. д.:

<% content_for :header do %>
  <%= javascript_include_tag 'admin' %>  
<% end %>

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

Я предпочитаю следующее...

в application_helper.rb file

def include_javascript (file)
    s = " <script type=\"text/javascript\">" + render(:file => file) + "</script>"
    content_for(:head, raw(s))
end

а затем в вашем конкретном представлении (app/views/books/index.формат html.ERB в этом примере)

<% include_javascript 'books/index.js' %>

... кажется, работает на меня.

эти ответы помогли мне много! Если кто-то хочет немного больше...

  1. вам нужно поместить javascripts в манифесты, если вы хотите, чтобы они были предварительно скомпилированы. Однако, если вам требуется каждый файл javascript из application.js.coffee тогда все javacsripts будут загружаться каждый раз, когда вы переходите на другую страницу, и цель выполнения специфичных для страницы javascripts будет побеждена.

поэтому вам нужно создать свой собственный файл манифеста (например,speciifc.js), что будет требуются все файлы javascript для конкретных страниц. Кроме того, изменить require_tree С application.js

app / assets / javascripts / application.js

//= require jquery
//= require jquery_ujs
//= require_tree ./global

app / assets / javascripts / specific.js

//= require_tree ./specific

затем в environments/production.rb добавьте этот манифест в предварительно скомпилированный список с параметром config,

config.assets.precompile += %w( specific.js )

готово! Все это shared javascripts, которые всегда должны быть загружены будет помещается в app/assets/javascripts/global папка, а страница-spcific javascripts в app/assets/javascripts/specific. Вы можете просто вызвать специфичные для страницы javascripts из представления, например

<%= javascript_include_tag "specific/whatever.js" %> //.js является необязательным.

этого достаточно, но я хотел использовать javascript_include_tag params[:controller] тоже. При создании контроллеров соответствующий файл coffeescript создается в app/assets/javascripts как и другие упомянутые люди. Есть поистине

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

<%= javascript_include_tag "my_javascipt_file" %>

Примечание: Для этого требуется еще один http-запрос на тег include, чем ответы, которые используют content_for :head

посмотри pluggable_js камень. Вы можете найти это решение проще в использовании.

Я понимаю, что конвейер активов предназначен для уменьшения времени загрузки страницы путем смешивания всех ваших js вместе в один (уменьшенный) файл. Хотя это может показаться отвратительным на поверхности, на самом деле это функция, которая уже существует в популярных языках, таких как C и Ruby. Такие вещи, как теги" include", предназначены для предотвращения многократного включения файла и помогают программистам организовать свой код. Когда вы пишете и компилируете программу на C, весь этот код присутствует в каждой части вашего запуска программа, но методы загружаются в память только тогда, когда этот код используется. В некотором смысле, скомпилированная программа не включает ничего, чтобы гарантировать, что код хорошо модульный. Мы делаем код модульным, записывая наши программы таким образом, и операционная система загружает в память только те объекты и методы, которые нам нужны для данной местности. Существует ли вообще такая вещь, как "метод-специфическое включение"? Если ваше приложение rails является restful, это, по сути, то, что вы просите.

Если вы пишете свой javascript так, чтобы он увеличивал поведение HTML-элементов на странице, тогда эти функции являются "специфичными для страницы" по дизайну. Если есть какой-то сложный код, который вы написали таким образом, что он будет выполняться независимо от его контекста, возможно, рассмотрите возможность привязки этого кода к элементу html в любом случае (вы можете использовать тег body, как описано в Гарбер-ирландский способ). Если функция выполняется условно, производительность, вероятно, будет меньше, чем все эти дополнительные тег script.

Я думаю об использовании Палома камень, как описано в rails apps project. Затем вы можете сделать свой javascript page-specific, включив page-specific функции в обратный вызов paloma:

Paloma.callbacks['users']['new'] = function(params){
    // This will only run after executing users/new action
    alert('Hello New Sexy User');
}; 

вы используете рельсы, поэтому я знаю, что вы любите драгоценные камни:)

вы не должны загружать свои файлы JS или CSS за пределами конвейера активов, потому что вы теряете важные функции, которые делают Rails настолько отличными. И тебе не нужен еще один камень. Я верю в использование как можно меньшего количества драгоценных камней, и использование драгоценного камня здесь не нужно.

то, что вы хотите, известно как "контроллер конкретного Javascript" ("действие конкретного Javascript включен в нижней части). Это позволяет загрузить определенный файл JavaScript для конкретного контроллера. Попытка подключения ваш Javascript для представления-это своего рода... назад и не следует шаблону проектирования MVC. Вы хотите связать его с контроллерами или действиями внутри контроллеров.

к сожалению, по какой-то причине Rails devs решили, что по умолчанию каждая страница будет загружать каждый файл JS, расположенный в вашем каталоге активов. Почему они решили сделать это вместо включения "конкретного Javascript контроллера" по умолчанию, я никогда не узнаю. Это делается через приложение.JS файл, который включает в себя следующую строку кода по умолчанию:

//= require_tree .

это называется директива. Это то, что sprockets использует для загрузки каждого JS-файла в каталоге assets/javascripts. По умолчанию, звездочки автоматически загружает приложение.js и применение.css и директива require_tree загружают каждый файл JS и Coffee в соответствующие каталоги.

Примечание: когда вы леса (если вы не леса, то теперь хорошее время начать), Rails автоматически генерирует кофе файл для вас, для контроллера, деревьев. Если вы хотите создать стандартный JS вместо кофе файл, затем удалить кофе это включено по умолчанию в вашем Gemfile, и ваш эшафот будет создавать файлы JS вместо этого.

Итак, первый шаг для включения "контроллер конкретного Javascript", чтобы удалить require_tree код из вашего приложения.js-файл или измените его в папку в каталоге assets/javascripts, если вам все еще нужны глобальные JS-файлы. И. Е.:

//= require_tree ./global

Шаг 2: заходим в свой config/инициализаторы/активы.rb файл, и добавить следующее:

%w( controllerone controllertwo controllerthree ).each do |controller|
  Rails.application.config.assets.precompile += ["#{controller}.js", "#{controller}.css"]
end

вставьте имена контроллеров, которые вы хотите.

Шаг 3: замените javascript_include_tag в вашем приложении.формат html.erb-файл с этим (обратите внимание на параметры [: controller] часть:

<%= javascript_include_tag 'application', params[:controller], 'data-turbolinks-track': 'reload' %>

перезагрузите сервер и альт! Файл JS, который был сгенерирован с помощью вашего scaffold, теперь будет загружаться только при вызове этого контроллера.

необходимо загрузить определенный JS-файл на определенное действие в контроллере, То Есть / articles / new ? Сделайте это вместо:

приложение.формат html.Эрб:

<%= javascript_include_tag "#{controller_name}/#{action_name}" if AppName::Application.assets.find_asset("#{controller_name}/#{action_name}") %>

файл config/инициализаторы/активы.РБ:

config.assets.precompile += %w(*/*)

затем добавить новая папка с тем же именем, что и контроллер, в папке assets/javascripts и поместите файл js с тем же именем, что и ваше действие. Затем он загрузит его на это конкретное действие.

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

контроллер

def get_script
   render :file => 'app/assessts/javascripts/' + params[:name] + '.js'
end
def get_page
   @script = '/' + params[:script_name] + '.js?body=1'
   render page
end

посмотреть

%script{:src => @script, :type => "text/javascript"}

Если по какой-то причине мы не хотим сделать это, то дайте мне знать.

предпочтительный способ добавить JS находится в нижнем колонтитуле, так что вы можете сделать это так:

показать.формат html.Эрб:

<% content_for :footer_js do %>
   This content will show up in the footer section
<% end %>

макеты/приложения.формат html.Эрб

<%= yield :footer_js %>

Comments

    Ничего не найдено.