좋아하는 버튼이 모든 게시물을 좋아합니다.

Question

내 앱에서 좋아요/안 좋아요 기능을 구현했습니다. 항목의 표시 페이지에서 아무 문제없이 좋아할 수 있습니다. 사용자 프로필 페이지에는 업로드 한 모든 음식이 나열되어 있는데, 두 가지 문제가 있습니다. 첫째, 한 음식에 대해 같은 버튼을 클릭하면 모든 음식에 대해 실행되고 모든 음식 아래에 버튼 텍스트가 표시됩니다. "이 음식과는 다른"대신 클릭 한 음식에 대한 버튼 텍스트 만 변경하는 것입니다. 같은 음식에 대해 DB에 저장된 내용이 저장되지만 분명히 내가 좋아하지 않은 음식에 대해 단추 텍스트가 변경되는 것을 원하지 않습니다. 둘째, 내가 상쾌하게하지 않고 페이지에서 다른 음식을 좋아하면, 실제로 클릭 한 음식 대신에 내가 클릭 한 음식으로 DB에 저장됩니다.

users.show.html.erb 

<% @user.foods.each do |food| %> 
    <div class="row col-md-12"> 
     <div class="food col-md-4"> 
      <h3 class="title"><%= link_to food.title.capitalize, food_path(food.id) %></h3> 
      <%= link_to (image_tag (food.image.url)), food_path(food.id) %> 
      <%= render 'shared/vote_form', :food => food %> 

      <%= link_to pluralize(food.votes.count, "person"), user_votes_path(:user_id => current_user.id, :food_id => food.id) %> <%= food.votes.count == 1 ? 'wants' : 'want' %> to gobble this 
     </div> 

     <div class="description col-md-6"> 
     <% if @user.id == current_user.id %> 

       <% if food.description.length == 0 %> 
        <p><%= link_to "Add Description", edit_food_path(food) %></p> 
       <% else %> 
        <p><%= food.description %><p> 
      <p><%= link_to "Edit Description", edit_food_path(food) %></p> 
       <% end %> 

      <% if food.recipe.length == 0 %> 
      <p><%= link_to "Add Recipe", edit_food_path(food) %></p> 
      <% end %> 

     <% else %> 

      <% if food.description.length == 0 %> 
      <p>No Description</p> 
      <% else %> 
      <p><%= food.description %><p> 
      <% end %> 

      <% if food.recipe.length == 0 %> 
      <p>No Recipe</p> 
      <% else %> 
      <p><%= link_to "View Recipe", food_path(food) %></p> 
      <% end %> 

     <% end %> 
     </div> 
    </div> 
<% end %> 

---

표 제어기

class VotesController < ApplicationController 

    def index 
    @votes = Food.find(params[:food_id]).votes 
    end 

    def new 
    @vote = current_user.votes.new 
    end 

    def create 
    @user = current_user 
    @vote = current_user.votes.build(vote_params) 


    if @vote.save! 
     @food = @vote.food 
     respond_to do |format| 
     format.html {redirect_to :back, notice: "Liked!"} 
     format.js 
     end 

     puts @vote.food.id 
    else 
     puts "No" 
     redirect_back(fallback_location: root_path) 
    end 
    end 

    def show 
    @user = current_user 
    @vote = Vote.find(params[:id]) 
    end 

    def destroy 
    @vote = Vote.find(params[:id]) 
    @food = @vote.food 

    if @vote.destroy! 
     respond_to do |format| 
     format.html {redirect_to :back, notice: "Unliked!"} 
     format.js 
     end 
    else 
     puts "NOOOOOO" 
    end 
    end 

    private 

    def vote_params 
    params.require(:vote).permit(:food_id) 
    end 
end 

---

vote partial 

<% unless current_user.votes.pluck(:food_id).include?(food.id) %> 
    <%= button_to "Like This Food", user_votes_path(current_user, { vote: { food_id: food.id } }), :remote => true %> 
<% else %> 
    <% vote = food.votes.where(user_id: current_user.id).first %> 
    <%= button_to "Unlike This Food", user_vote_path(current_user, vote), :remote => true, method: "delete" %> 
<% end %> 

---

create.js.erb 

$('.button_to').replaceWith("<%= j (render :partial => 'shared/vote_form', :locals => { :food => @food, :food_id => @food.id }) %>"); 

---

Answer 1

create.js.erb (destroy.js.erb에 동일한 문제가 있음)을 살펴보십시오. 요소를 클래스 button_to과 함께 선택하십시오 - 페이지의 모든 버튼입니다. 그런 다음 을 모두 버튼으로 대체하여 replaceWith으로 전화하면 버튼이 인수로 제공됩니다. 결과적으로 모든 버튼이 방금 좋아하는 음식에 해당하는 버튼으로 바뀝니다. 이 버튼은 페이지의 모든 버튼에 영향을 미치고 가장 먼저 좋아하는 음식을 가리키는 역할을합니다.

해결책은 단추에 속한 음식 ID를 포함하는 단추에 id 특성을 추가하는 것입니다. 예를 들어 ID가 1 인 Food이 Lettuce 인 경우 id="like-1"을 버튼에 추가하고 $('.button_to')을 $("#like-1")으로 변경해야합니다.