link_to и remote => true + jquery: как?Помогите? - PullRequest
Новая
       28

link_to и remote => true + jquery: как?Помогите?

17 голосов
/ 13 августа 2011

Я пытаюсь сделать ссылку «Пользователи» в индексе моего сайта rails, чтобы она показывала зарегистрированных пользователей (User.all), НО я хочу, чтобы это отображалось в правой части сайта, как частичное, вdiv без загрузки всей страницы с самого начала.

Я знал, что это возможно со старым прототипом и remote => true, но с Rails 3.1 и jQuery (и активами) я понятия не имею, как это сделать.

Может кто-нибудь помочь или показать мне путь к учебнику?

Ответы [ 2 ]

47 голосов
/ 30 декабря 2011

Это на самом деле довольно просто, это просто кажется большим делом, потому что это ново.По сути, благодаря новой ненавязчивой поддержке javascript скрипт rails ujs предоставляет набор событий, с которыми можно связать функции javascript, а именно:

  1. ajax: beforeSend - срабатывает до отправки
  2. ajax: success - срабатывает после отправки, содержит ответ
  3. ajax: complete - срабатывает после события успеха
  4. ajax: error - срабатывает при наличии ошибок

все, что вам нужно сделать, это написать функцию (которую вы оборачиваете в $ document.ready), которая в свою очередь связывает некоторые анонимные функции с каждым из этих событий или только с интересующими вас событиями.

Например, предположим, у вас есть div, в который вы хотите поместить данные ответа с идентификатором «response_data», и у вас есть ссылка с идентификатором «ajax_trigger».Примерно так: 

<%= link_to "My Link", some_model_path(@model_instance), 
                       :remote => true, :html => {:id => "ajax_trigger"} %>
<div id="response_data">
</div>

Все, что вам нужно сделать, это предоставить функцию, подобную приведенной ниже, чтобы поместить ответ от сервера в div: 

$(document).ready(
     function(){
          $("a#ajax_trigger").bind("ajax:success",
                   function(evt, data, status, xhr){
                        //this assumes the action returns an HTML snippet
                        $("div#response_data").html(data);
           }).bind("ajax:error", function(evt, data, status, xhr){
                    //do something with the error here
                    $("div#errors p").text(data);
           });
});

Действительно,все, что вы делаете с javascript - это обрабатывает ответ, когда он возвращается с сервера.На самом деле вам не нужно делать ничего особенного, чтобы инициировать запрос XHR, и вы также можете безопасно хранить этот метод в файле .js, который обрабатывается как статический актив.Если вы используете Rails 3.1, вы должны поместить его в файл с соответствующим именем javascript, соответствующий контроллеру.В вашем контроллере вы должны убедиться, что вы указали: layout => false в методе respds_with (), чтобы контроллер просто возвращал часть или шаблон, который он отображает, а не полную страницу.Эта настройка также работает с действиями, которые возвращают javascript, который будет выполнен клиентом, а также JSON, в зависимости от того, какой тип данных вы указываете в запросе.

Я нашел этот пост в блоге весьма полезным:*http://www.alfajango.com/blog/rails-3-remote-links-and-forms/

9 голосов
/ 13 августа 2011
...