Ruby / Rails / AJAX / JQuery - при щелчке по ссылке, передаче параметра и выполнении действия контроллера

Question

Я пытаюсь использовать щелчок по ссылке для выполнения и действия в моем контроллере под названием «да», но делаю это на стороне клиента, а не обновлять каждый раз, когда пользователь нажимает.

До того, как у меня была ссылка_ на этунаправлено на действие с именем «да» и передано id модели, которую я назвал «событие»

      <%= link_to "yes", yes_path(event)%>   (in view)

      match 'user/:id/yes' => 'user#yes', :as => "yes"   {in routes.rb)

Проблема в том, что каждый раз, когда пользователь нажимает на ссылку, страница обновляется во время выполнения операции «да».действие, так что это будет проходить намного плавнее, если я скажу бэкэнду выполнить действия на стороне клиента.

S0 Я нашел здесь ссылку: выполнить контроллер / действие из JavaScript в rails3

и взглянул на документацию: http://api.jquery.com/jQuery.ajax/

И придумал это.Где, если сообщение успешно на предыдущем маршруте сверху, измените класс css для ссылки (измените цвет).

 $.ajax({
       type: "POST",
       url: "/user/" + $(this).attr('event') + "/yes/",
       success: function(){
           $(".like").click(function() {
           if ($(this).hasClass("selected")) {
           $(this).addClass("selected");
           return false;  } 
    });

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

respond_to do |format|
     format.html { }
     format.js
end

Так что теперь мой link_to выглядит следующим образом

 <%= link_to "yes", yes_path(event), :class => "like", :remote => true %>

Но страница все еще обновляется, и она совсем не похожа на вызов AJAX.

• правильно ли я передаю параметр "event" как атрибут jquery?
• правильно ли я вызываю link_to?Это мой первый раз, так что я понятия не имею, что я делаю неправильно, возможно, несколько вещей?

Я бы очень признателен за любую помощь

Answer 1

Это то, что вы ищете?

$(".like").click(function(evt) {
    evt.preventDefault();

    var $self = $(this);
    $.post($self.attr("href"), function(response) {
        $self.addClass("selected");
    });
});

Первая строка связывает JavaScript со всеми элементами с классом like. preventDefault является предпочтительным способом предотвращения поведения по умолчанию тега привязки (перейдите к href). $.post() является сокращением для $.ajax({ type: "POST" }).

Все, что вы хотите, чтобы произошло после успешной публикации на сервер, и, наконец, вызов функции Первый аргумент - это ответ от сервера.

Рич