I have built some code that sorts an index page, using links in my view. This works fine with links, and the working code is this:
<p>
<%= link_to "Sentence", :controller => params[:controller], :action => params[:action], :type => '1', :class => "btn" %>
<%= link_to "Question", :controller => params[:controller], :action => params[:action], :type => '2', :class => "btn" %>
<%= link_to "Mnemonic", :controller => params[:controller], :action => params[:action], :type => '3', :class => "btn" %>
<%= link_to "Article", :controller => params[:controller], :action => params[:action], :type => '4', :class => "btn" %>
<%= link_to "Recommendation", :controller => params[:controller], :action => params[:action], :type => '5', :class => "btn" %>
</p>
I would like to use a button group, and have built this example using Twitter Bootstrap in plain HTML:
<div class="btn-group">
<button class="btn">Sentence</button>
<button class="btn">Question</button>
<button class="btn">Mnemonic</button>
<button class="btn">Article</button>
<button class="btn">Recommendation</button>
</div>
I cannot get the links converted to the button row. I have tried various styling options as well as attempting to use button_to. Ideally I would like to further style the buttons so that the currently selected one is a different color than the others.
EDIT
Output of HTML as suggested:
<div class="btn-group">
<a href="/dialog_catagories?class=btn&type=1">Sentence</a>
<a href="/dialog_catagories?class=btn&type=2">Question</a>
<a href="/dialog_catagories?class=btn&type=3">Mnemonic</a>
<a href="/dialog_catagories?class=btn&type=4">Article</a>
<a href="/dialog_catagories?class=btn&type=5">Recommendation</a>
</div>
The btn-group is preventing the buttons from rendering on the page for some reason, even though it is in the html.
EDIT 2
HTML code as per Varun's answer:
<div class="btn-group">
<a href="/dialog_catagories?html%5Bclass%5D=btn&type=1">Sentence</a>
<a href="/dialog_catagories?html%5Bclass%5D=btn&type=2">Question</a>
<a href="/dialog_catagories?html%5Bclass%5D=btn&type=3">Mnemonic</a>
<a href="/dialog_catagories?html%5Bclass%5D=btn&type=4">Article</a>
<a href="/dialog_catagories?html%5Bclass%5D=btn&type=5">Recommendation</a>
</div>
SOLUTION
@Varun's suggested answer worked in the end:
<div class="btn-group">
<%= link_to "Sentence", "?type=1", :class => "btn" %>
<%= link_to "Question", "?type=2", :class => "btn" %>
</div>
I am a bit unclear how the functionality is still working, as the following is not being explicitly passed:
:controller => params[:controller], :action => params[:action]
But it is working fine. Thank you.
Try this:
<div class="btn-group">
<%= link_to "Sentence", :controller => params[:controller], :action => params[:action], :type => '1', :html => { :class => "btn" } %>
<%= link_to "Question", :controller => params[:controller], :action => params[:action], :type => '2', :html => { :class => "btn" } %>
<%= link_to "Mnemonic", :controller => params[:controller], :action => params[:action], :type => '3', :html => { :class => "btn" } %>
<%= link_to "Article", :controller => params[:controller], :action => params[:action], :type => '4', :html => { :class => "btn" } %>
<%= link_to "Recommendation", :controller => params[:controller], :action => params[:action], :type => '5', :html => { :class => "btn" } %>
</div>
Edit
Try this:
<div class="btn-group">
<%= link_to "Sentence", "?type=1", :class => "btn" %>
<%= link_to "Question", "?type=2", :class => "btn" %>
</div>
I'm still on Rails 2 and the html=> { :class => :btn } wasn't working for me.
I did this and it renders/works nicely
<div class="btn-group">
<%= link_to "Pool my Order",
{:controller => :purchasing, :action => :search_for_salesdoc,
:sold_to_number => sold_to, doc_number => @cart.doc_number,
:search_option => :pool},
:class => "btn btn-success align-center" %>
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With