2017-10-07 1 views
0

J'ai des boutons upvote/downvote sur un site que je veux afficher différemment selon que l'utilisateur a ou non validé le post. J'utilise la gem acts_as_votable pour gérer les votes afin que je puisse obtenir une valeur booléenne avec @ user.voted_up_on? @poster. Comment puis-je ajouter conditionnellement la classe bootstrap de btn-success au bouton upvote si un utilisateur a activé la publication? Mon bouton upvote ressemble à ceci:Comment ajouter de manière conditionnelle une classe bootstrap à un bouton dans les rails

<%= link_to upvote_path(:post => post), class: "btn btn-md", :method => :post do %> 
    <span class="glyphicon glyphicon-arrow-up"></span> 
<% end %> 

Répondre

1

Ajouter helper:

def upvote_link(user, post) 
    if user.voted_up_on?(post) 
    btn_class = "btn btn-md btn-success" 
    else 
    btn_class = "btn btn-md" 
    end 

    link_to upvote_path(:post => post), class: btn_class, :method => :post do 
    concat content_tag(:span, "", class: "glyphicon glyphicon-arrow-up") 
    end 
end 

Et utiliser en vue

<%= upvote_link(@user, @post) %> 
+0

Works , Merci!! – RT5754

0

conditionals Utilisation: D

button_classes = @user.voted_up_on?(@post) ? "btn btn-md btn-success" : "btn btn-md" 

ou

button_classes = ["btn", "btn-md"] 
button_classes.push("btn-success") if @user.voted_up_on?(@post) 

et l'utiliser, respectivement

<%= link_to upvote_path(:post => post), class: button_classes, :method => :post do %> 
    <span class="glyphicon glyphicon-arrow-up"></span> 
<% end %> 

ou

<%= link_to upvote_path(:post => post), class: button_classes.join(' '), :method => :post do %> 
    <span class="glyphicon glyphicon-arrow-up"></span> 
<% end %> 
0

Vous pouvez utiliser une instruction if pour afficher différents HTML selon votre booléen

<% btn_class = "btn btn-md" %> 
<% btn_class = "btn btn-md btn-success" if @user.voted_up_on?(@post) %> 
<%= link_to upvote_path(:post => post), class: btn_class, :method => :post do %> 
    <span class="glyphicon glyphicon-arrow-up"></span> 
<% end %>