ROR学习笔记(36)——表格排序

一直想实现表格的排序,网上查到wice_grid是个很不错的gem,看了例子也觉得超炫酷。所以bundle install来尝试一下。但不知道为何总有一些莫明其妙的问题使用不上。所以想自己尝试写一下。
刚开始准备用AJAX来实现,正好显摆一下自己前两天刚刚学会的技巧,但苦于基础太差。尝试失败。
又想排序即使用同步实现的话,从用户的角度上来说,应该可以接受。所以就尝试用同步的方式来做。
代码写的很乱,性能也没有验证,但万幸功能实现了。具体如下:

  1. routes中增加一个路由:
match "/products/sort_by/:sort_id", to: "products#sort_by",  via: "get"
  1. 在products/index.html.erb中修改一下代码,使得表头变成链接:
<table class="table table-striped">
  <thead>
    <tr>
 
      <th><%= link_to "ID", "/products/sort_by/#{@order[:p_id]}" %></th>
      <th><%= "Name" %></th>
      <th><%= link_to "Price", "/products/sort_by/#{@order[:p_price]}" %></th>
      <th><%= link_to "Description", "/products/sort_by/#{@order[:p_description]}"  %></th>
      <th><%=t '.actions', :default => t("helpers.actions") %></th>
    </tr>
  </thead>

需要注意的是, @order[:p_id]中的”:p_id",定义在controller的order_init方法中。

  1. 对应的productscontroller中增加下面的代码:
  def index
    @products = Product.all.paginate(page: params[:page], per_page: 12)
    #初始化排序相关的数据
    @order = order_init
  end
  def sort_by
    @order = order_init
    #判断传过来的参数是否是正确的值,如果是,进行排序,如果不是,跳转到root_path
    #@order[:p_by]是一个数组,包含所有字段正序和倒序的情况
    if @order[:p_by].include?(params[:sort_id])
      @products = Product.all.order("%s %s" % params[:sort_id].split("_")[1..2])
      #在前面已经把所有列的排序情况初始化了,下面是当某一列进行排序后,下一次点击则变为反序
      order_change(@order, params[:sort_id])
      @products = @products.paginate(page: params[:page], per_page: 12)
      respond_to do |format|
        #一定要用render,这样@products才是排序后的数据
        format.html {render 'index'}       
      end
    else
      redirect_to root_path
    end
  end
  
private 
    #初始化@order,如果要增加可排序的列,只需要在这个方法增加order[:column] = "column_desc"即可
    def order_init
      order = {}
      order_by = ["desc", "asc"]
      order[:p_price] = "p_price_desc"
      order[:p_id] = "p_id_desc"
      order[:p_description] = "p_description_desc"
      order[:p_by] = []
      order.keys.each do |key|
        order_by.each { |ele| order[:p_by] << "#{key.to_s}_#{ele}" }        
      end
      return order
    end
    #当某一列进行排序后,下一次点击则变为反序
    def order_change(order, string)
      temp = string.split("_")
      key = temp[0] + "_" + temp[1]
      value = temp[2]
      value = value == "desc" ? "#{key}_asc" : "#{key}_desc"
      order[key.to_sym] = value
    end

这样就OK了

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 195,898评论 5 462
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 82,401评论 2 373
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 143,058评论 0 325
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,539评论 1 267
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,382评论 5 358
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,319评论 1 273
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,706评论 3 386
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,370评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,664评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,715评论 2 312
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,476评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,326评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,730评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,003评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,275评论 1 251
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,683评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,877评论 2 335

推荐阅读更多精彩内容