Search code examples
javascriptjqueryruby-on-railsajaxsocial-media-like

Rails 4 Ajax like button failing to wоrk


Im struggling to make my Like links to work with ajax. After clicking on "Like" nothing changes, only after refreshing the page I can see that like got counted.

EDIT: Addet routes. EDIT2: I inspected the Like link with Firebug and after entering the code from like.js.erb file it shows message: Image My like.js.erb file:

        <% if Like.find_by(likeable: @post) %>
          $(".likes").html("<%= escape_javascript(render 'posts/unlike' ) %>");
        <% else %>
          $(".likes").html("<%= escape_javascript(render 'posts/like' ) %>");
        <% end %>

(I have checked and If conditions works fine). My partial for posts (_post.html.erb).

    <li class="post">
        <span class="user"><%= link_to post.user.name, post.user %></span>
        <br>
        <span class="title"><%= post.title %></span>
        <br>
        <span class="ava"><%= image_tag post.avatar(:large) %></span>
        <br>
        <span class="timestamp">
            Posted <%= time_ago_in_words(post.created_at) %> ago.
            <% if logged_in? && current_user.admin? %>
                <%= link_to "delete", post, method: :delete,
                                                                        data: { confirm: "You sure?" } %>
            <% end %>
################## START OF THE LIKES #####################
            <span class="likes">
                <span class="like">
                <% if logged_in? %>
                    <% if !current_user.likes?(current_user, post) %>
                        <%= render 'posts/like', post: post %>
                        <!-- <%= link_to "Like", like_post_path(post, like: true), method: 'post', remote: true %> -->
                    </span>
                    <% else %>
                    <span class="unlike">
                        <%= render 'posts/unlike', post: post %>
                        <!-- <%= link_to "Unlike", like_post_path(post, like: false), method: 'post', remote: true %>-->
                    </span>
                    <% end %>
                    (<%= pluralize( post.likes.size, "like") %>)
                <% else %>
                    <%= link_to "Like", login_path,
                          data: { confirm: "You need to log in to like" } %>
                    (<%= pluralize( post.likes.size, "like") %>)
                <% end %>
            </span>
################## THE END OF THE LIKES #####################
        </span>
    </li>

And the like method in the post controller.

def like
    post = Post.find(params[:id])
    if Like.find_by(likeable: post)
        Like.find_by(likeable: post).destroy
        respond_to do |format|
            format.html do
                flash[:success] = "Like Updated!"
                redirect_to :back
            end
            format.js
            end
    else
        Like.create(likeable: post, user: current_user, like: params[:like])
        respond_to do |format|
            format.html do
                flash[:success] = "Like Updated!"
                redirect_to :back
            end
            format.js
        end
    end
end

And Like and Unlike partials I use: Like:

<%= link_to "Like", like_post_path(post, like: true), method: 'post', remote: true %>

Unlike:

<%= link_to "Like", like_post_path(post, like: false), method: 'post', remote: true %>

Any help or advice would be nice. I know that my code is rather in bad condition so don't be afraid to suggest some changes in it. And finally Please help me, I have wasted tons of time on trying to make it work but no results yet.

Routes:

Rails.application.routes.draw do
    root 'main_page#home'
    get         'top_list'  => 'main_page#top_list'
    get         'sign_up'   => 'users#new'
    get         'posts/new'
    get         'login'         => 'sessions#new'
    post        'login'         => 'sessions#create'
    delete  'logout'        => 'sessions#destroy'
    resources :users
    resources :posts do
        member do
            post 'like'
        end
    end
end

There are logs after I click on Like.

Completed 500 Internal Server Error in 66ms (ActiveRecord: 41.0ms)

NameError (undefined local variable or method `post' for #<#<Class:0x007f8ce976ff48>:0x007f8ce976f3e0>):
  app/views/posts/_unlike.html.erb:1:in `_app_views_posts__unlike_html_erb___187529012528174235_70121703666860'
  app/views/posts/like.js.erb:4:in `_app_views_posts_like_js_erb__3375438513772599537_70121703368540'
  app/controllers/posts_controller.rb:38:in `like'

Solution

  • Try adding html_safe at the end. Also, I think render needs post as well (like you do in views)

    $(".likes").html('<%= escape_javascript(render "posts/unlike",post: @post).html_safe %>');
    

    http://apidock.com/rails/String/html_safe