Question

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&amp;type=1">Sentence</a>
  <a href="/dialog_catagories?class=btn&amp;type=2">Question</a>
  <a href="/dialog_catagories?class=btn&amp;type=3">Mnemonic</a>
  <a href="/dialog_catagories?class=btn&amp;type=4">Article</a>
  <a href="/dialog_catagories?class=btn&amp;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&amp;type=1">Sentence</a>
  <a href="/dialog_catagories?html%5Bclass%5D=btn&amp;type=2">Question</a>
  <a href="/dialog_catagories?html%5Bclass%5D=btn&amp;type=3">Mnemonic</a>
  <a href="/dialog_catagories?html%5Bclass%5D=btn&amp;type=4">Article</a>
  <a href="/dialog_catagories?html%5Bclass%5D=btn&amp;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.

Answer 1

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>