Been trying to implement a like button that will be disabled after create the record via ajax .Below is my code implementation .How do i make the user only able to click once and reload the page and disabled the button?.Current implementation works only when the page is reloaded manually.

My implementation idea :
Load the like association relation user\_id array via this line in the view

```
<% if listing.like.collect(&:user_id).include?(current_user.id)%>

```

and verify if the current\_user is included in order to display the disabled button. 

Models 

```
class Listing < ActiveRecord::Base
   has_many   :like, foreign_key: :listing_id, dependent: :destroy
end 

class Like < ActiveRecord::Base  
  belongs_to  :listing
  belongs_to  :user
end

```

like Controller

```
class LikesController < ApplicationController  
before_filter :authenticate_user!

  def create 
     @like = Like.new(like_params)
     respond_to do|format|
     if@like.save
         current_user.create_activity(@like, "like")
       format.js
     else
        format.html (redirect_to root_url , notice:"Unable to proceed")
        format.js
     end
    end
  end

 [...]

end

```

Views

```
 <%=form_for(Like.new,:remote => true) do |f| %> 
       <%= f.hidden_field :listing_id, value: listing.id %>
       <%= f.hidden_field :user_id, value: current_user.id %>
       <% if (listing.like.collect(&:user_id).include?(current_user.id)) == true %>
             <%= f.button " " , class: 'round-button btn-center', data:{disabled: true} do %>
                <span class="glyphicon glyphicon-heart"></span>    
             <%end%>   
          <%else%>
              <%= f.button " " , class: 'round-button btn-center', data:{disable_with: "<i class='fa fa-spinner fa-spin'></i>"} do %>
                <span class="glyphicon glyphicon-heart"></span>    
             <%end%>
        <%end%>
      <%end%>

```

=>\_listing.html.erb

```
<div class="item">
  <%= link_to (image_tag listing.image.url(:medium)), listing_path(listing) %>               
    <div class="info">
      <span class="item_title"><%= listing.name %></span>
        <%if listing.display_usd == true %>
          <span class="item_price"><%=number_to_currency(listing.price, unit:"$", precision: 2)%></span> 
        <% else %>
          <span class="item_price"><%=number_to_currency(listing.price, unit:"HTG", precision: 2)%></span> 
        <%end%>
      <span class="avatar_info">
         <%=link_to seller_path(listing.user.id) do %>
         <%=image_tag listing.user.avatar.url(:athumb), size: "20x20", 
             alt: "avatar",class: "img-circle has-tooltip ",
             title: listing.user.username , 'data-toggle' => 'tooltip', 'data-placement' => 'top'  %>
         <%end%>
      </span>

    </div>

    <% if listing.created_at >= (Date.today)%>
      <span class="label label-green">New</span>
    <%end%>

  <div class="block-actions clearfix">
    <%= render partial: "likes/form", listing: @listing %>
  </div>
</div>

```