Блог

Я использую Ruby на Rails 3, и я хотел бы использовать jQuery вместо Prototype (это то, что я использую в настоящее время). Я прочитал много книг, руководств и руководств, но я все еще не понимаю, как я должен использовать jQuery в своем коде (возможно, это швы, что никто не «действительно» разбирается в этом вопросе). Кроме того, у меня есть много кода, написанного с использованием Prototype, поэтому я хотел бы обрабатывать оба одновременно и «постепенно» переходить на jQuery.

Я включил файл jQuery в создание файла макета, <%= javascript_include_tag :defaults, 'jquery' %> чтобы <script src="/javascripts/jquery.js?1307515315" type="text/javascript"></script> он присутствовал в исходном коде всех HTML-страниц. Чтобы избежать ошибок в application.js файле, который я добавил jQuery.noConflict() в application.js файл. Теперь, что я должен сделать?

Если я укажу метод jQuery в application.js файле

 jQuery(document).ready(function() {
    jQuery('#test_id2').click(function() {
      alert('Handler for .click() called.');
    });
})
  

и я называю это использованием

 <%= link_to 'change1', '#', :id => 'test_id1' %>
  

это будет работать, но я хотел бы поместить приведенный выше код в отдельный js файл. Как я могу сделать and maj?

Как я должен назвать файл JS для действия контроллера? Где (в какой папке) Я должен найти соответствующий JS-файл? Как я могу указать respond_to метод в своих контроллерах?

 def edit
  ...
  respond_to do |format|
    format.html # render edit.html.erb
    format.js # render... what file?! where?!
  end
end
  

Используя Prototype, я могу писать код непосредственно в файлах просмотра, подобных следующему:

 <%= link_to_function( "change", :id => 'test_id2' ) do |page|
  page[:test_id3].toggle
  ...
end %>
  

Как я могу это сделать, используя jQuery в файлах просмотра?

У вас есть какой-нибудь совет?

Обновить

В моем edit.js.erb файле у меня есть

 <%
jQuery(document).ready(function() {
    jQuery('#test_id1').click(function() {
      alert('Handler for .click() called.');
    });
})
%>
  

В edit.html.erb файле у меня есть

 <%= link_to 'Test link', '#', :id => 'test_id1' %>
  

Но когда я нажимаю на приведенную выше ссылку, jQuery не работает (метод alert не запускается). Кроме того, если я пытаюсь вставить код JavaScript непосредственно в файл просмотра, я получаю следующую ошибку:

 NameError: undefined local variable or method `document' for #<#<Class:0x00000102aa04d0>:0x00000102a75eb0>
  

Есть две разные вещи.

Это обычные скрипты, которые вы можете загружать так же, как вы делали с jquery: вы помещаете их в свои public/javascript каталоги и включаете в

 <%= javascript_include_tag YourNameFile %>
  

Обратите внимание, что я не добавлял .js. javascript_include_tag сделает это за вас.

Тогда у вас есть шаблоны JS. Это похоже на ваши представления прототипа. За исключением того, что у вас есть Jquery внутри. Итак, то, что вы делали ранее, работает! Если вы используете

 respond_to do |format|
  format.html # render edit.html.erb
  format.js # render edit.js.erb
end
  

Он будет отображаться edit.js.erb (вы можете найти его в том же каталоге, что и ваш edit.html.erb файл).

Затем вы можете добавить свой jQuery И ‘ruby’ в эти файлы (точно так же, как в prototype). Просто убедитесь, что вы загрузили свой jQuery.

Если я что-то пропустил, добавьте комментарий. 🙂

=== РЕДАКТИРОВАТЬ ===

В ваших шаблонах вы должны размещать <% %> только функцию arounds Rails !! В противном случае это должен быть Javascript. Итак, вы edit.js.erb должны выглядеть следующим образом:

 jQuery(document).ready(function() {
    jQuery('#test_id1').click(function() {
      alert('Handler for .click() called.');
    });
})
  

Ваши файлы должны иметь имена *.js.erb и находиться в папке просмотра (точно так же, как ваши *.html.erb), они должны быть названы так же, как вы называете свои файлы *.html.erb, т. е. edit.js.erb для действия редактирования. Вы можете написать свой код ruby в этих файлах точно так же, как вы делали это для prototype (<% …. %>). Работая с jQuery, вы обычно работаете с селекторами. Например, если вам нужно заменить некоторый html-код на вашей странице внутри некоторой <div id=someid></div> конструкции, вы можете сделать это следующим образом (# перед идентификатором элемента важен):

 $("#someid").html('<%= ... some ruby here, it can be render or anything ... %>')
  

Если вам нужно что-то вставить после какого-либо элемента, вы делаете это следующим образом:

 $('<div>Some text</div>').insertAfter("#someid")
  

И так далее.