Question

我正在尝试动态更改（如果它被点击）一个普通的表头（这是一个链接）到另一个定义的CSS类'th.hilite'。此链接只是对此列进行排序，每次用户对列表进行排序时，标题都应突出显示。

应该更改相关课程的视图如下所示：

%table#mytable
  %thead
    %tr
      %th= link_to 'Title', mytable_path(:sort => 'title'), :id => 'title_header'

我的问题很简单：如果点击标题，我可以如何以及在何处将类动态设置为％th.hilite？

Answer 1

您可以直接从视图中绑定它：

%th{:class => ("hilite" if @sort == "title")}= link_to 'Movie Title'...

但是，您还必须在控制器中声明@sort实例变量，并根据哪个列将其设置为 title 或 release 你正在整理。（即@sort = params[:sort]）

Answer 2

如果您能找到解决方法，请注意不要在视图中放置逻辑（偶数条件）。为了避免这种常见错误，您需要充分利用参数和会话哈希并在控制器中设置适当的变量

# In your view
%th{:class => @title_header}= link_to 'Title', my_path(:sort => 'title'), :id => 'title_header'

# In your controller
sort = params[:sort] || session[:sort]
if sort == 'title'
  ordering = {:order => :title}
end

Answer 3

只要您的参数值与列名匹配，就行了BTW - 不需要对每个值进行编码

def index
    @by=params[:by]
    @movies = Movie.order(params[:by]).all
  end

Answer 4

不需要Javascript或jquery ..

以下HAML将起作用

%th{:class=>('title' == @sortby)?'hilite':""}= link_to  'Movie Title', movies_path(:sort => 'title'), :id => 'title_header'

Answer 5

您应该使用JavaScript来执行此操作。我认为使用jQuery而不是纯JavaScript是个好主意。以下是一些例子

http://api.jquery.com/click/

http://api.jquery.com/css/

从ruby控制器有条件地设置CSS样式

5 个答案: