wyc
wyc

Reputation: 55263

How to build an if statement with the following URL param?

I'm using the following to enable users to sort comments by date (ASC), date (DESC) and vote:

posts_controller.rb:

  def show
    @post = Post.find(params[:id])
    @comments = @post.comments.paginate(:page => params[:page],
                                        :per_page => 5).order(params[:order_by])
    @comment = @post.comments.build
  end

views/posts/show.html.erb:

<div class="comments-tabs">
  <span><%= link_to 'Votes', post_path(@post, :order_by => "total_votes DESC") %></span>
  <span><%= link_to 'Date (ASC)', post_path(@post, :order_by => "created_at ASC") %></span>
  <span><%= link_to 'Date (DESC)', post_path(@post, :order_by => "created_at DESC") %></span>
</div>

the URL ends up looking like this:

http://localhost:3000/posts/59?order_by=total_votes+DESC
http://localhost:3000/posts/59?order_by=created_at+ASC
http://localhost:3000/posts/59?order_by=created_at+DESC

I would like to create an if statement to add a class to the current tab. For example:

    http://localhost:3000/posts/59?order_by=created_at+ASC


  <span class="comment-tab"><%= link_to 'Votes', post_path(@post, :order_by => "total_votes DESC") %></span>
  <span class="comment-tab current"><%= link_to 'Date (ASC)', post_path(@post, :order_by => "created_at ASC") %></span>
  <span class="comment-tab><%= link_to 'Date (DESC)', post_path(@post, :order_by => "created_at DESC") %></span>

Upvotes: 1

Views: 175

Answers (4)

James Dunn
James Dunn

Reputation: 192

This is a great question. You really got me thinking. I've wanted to accomplish something similar in my own project, to refactor some smelly if statements that were used to style a div or li differently when its containing link was equal to the current page.

I wrote this in coffee-flavored jQuery. Give it a try.

app/assets/javascripts/current_tab.js.coffee

$(document).ready ->
  $('.comment-tab').each ->
    if $(this).children('a').first().attr('href') is window.location.href
      $(this).addClass('current')

Change post_path to post_url in the view, and it should work.

app/views/posts/show.html.haml

.comments-tabs
  %span= link_to 'Votes',       post_url(@post, order_by: 'total_votes DESC')
  %span= link_to 'Date (ASC)',  post_url(@post, order_by: 'created_at ASC')
  %span= link_to 'Date (DESC)', post_url(@post, order_by: 'created_at DESC')

Upvotes: 0

brad
brad

Reputation: 9773

<div class="comments-tabs">
  <span><%= link_to 'Votes', post_path(@post, :order_by => "total_votes DESC"), {}, {:class => "#{params[:order_by] == 'total_votes+DESC' ? 'comment_tab current' : 'comment_tab'}"} %></span>
  <span><%= link_to 'Date (ASC)', post_path(@post, :order_by => "created_at ASC"), {}, {:class => "#{params[:order_by] == 'created_at+ASC' ? 'comment_tab current' : 'comment_tab'}"}  %></span>
  <span><%= link_to 'Date (DESC)', post_path(@post, :order_by => "created_at DESC"), {}, {:class => "#{params[:order_by] == 'created_at+DESC' ? 'comment_tab current' : 'comment_tab'}"} %></span>
</div>

Untested.

Upvotes: 0

Jon
Jon

Reputation: 10898

You can use the current_page? method to determine whether the user is viewing a certain page and apply an html class based on that.

Here's an example:

 %ul
    %li{:class => "#{current_page?(root_path) ? "selected" : ""}"}= link_to content_tag(:span, "Home"), root_path
    %li{:class => "#{current_page?(birth_certificate_path) ? "selected" : ""}"}= link_to content_tag(:span, "Birth Certificates"), birth_certificate_path
    %li{:class => "#{current_page?(marriage_certificate_path) ? "selected" : ""}"}= link_to content_tag(:span, "Marriage Certificates"), marriage_certificate_path
    %li{:class => "#{current_page?(death_certificate_path) ? "selected" : ""}"}= link_to content_tag(:span, "Death Certificates"), death_certificate_path

Upvotes: 1

Sandip Ransing
Sandip Ransing

Reputation: 7733

Have a look at link_to_unless_current method of rails api

<%=
    link_to_unless_current("Comment", { :controller => "comments", :action => "new" }) do
       link_to("Go back", { :controller => "posts", :action => "index" })
    end
 %>

Upvotes: 0

Related Questions