Railsで使えるGem

Railsのテーブル並び替えを実装する

投稿日:

 

 

環境 RailsにTwitter Bootstrapを設定する~twitter-bootstrap-rails

参考 #147 Sortable Lists (revised) @Railscasts

 

並び替えは次のメソッドで実行する

昇順がasc、降順がdesc

やること

  • テーブルのカラム名をクリックすると上矢印が現れて昇順に並び替える
  • もう一度同じカラム名をクリックすると下矢印に変わって降順に並び替える
  • 違うカラム名をクリックすると上矢印が現れて昇順に並び替える、前の矢印は消える

仕組み

  1. リンクを作成して:sortにカラム名を投げてindexを呼びなおす
  2. その際、もし前と同じカラム名なら方向をトグルする(ascならdesc、descならasc)
  3. もし前と違うカラム名なら方向はascにする
  4. モデル名.order(カラム名+’ ‘+昇順・降順)で指定した順序でデータを呼び出す
  5. カラム名がついているテーブルヘッドの値の後ろに昇順なら上矢印・降順なら下矢印をつける

コーディング

View

<th>のうちソートをしたいタイトルにリンクを作成して:sortにカラム名を投げてindexを呼びなおす

model_class.human_attribute_name はtwitter-bootstrap-railsがgenerateしたもの 普通に:nameでもOK

ソートさせたいカラムの分だけ作成する

Controller

View

ブートストラップで上矢印アイコンは次のとおり

選択されたカラム名(@sort)の後ろに、指定された方向(@direction)にしたがって矢印アイコンを出す

 

テスト作成とHelper化のリファクタリングは後日

-Railsで使えるGem
-,

執筆者:

関連記事

no image

Rails3.2のアプリにユーザー機能を追加する~Devise

  アプリにユーザー機能を追加するためにdeviseというgemを使った deviseを使えば高機能なユーザー管理機能を簡単につけることができる 参考 Rails3.2+Mongoidでログ …

sunspot_railsで全文検索

sunpotはsolrというJava製の全文検索サーバをrubyから使えるGem sunspot_rails はsunspotにマージされてました 参考 railscasts.com/episodes

Rubyでウェブサイトを操作してリストをつくる〜mechanize

    By: JoshSemans   以前からRailscastsというRuby on Railsの動画サイトが好きでよく見ているのだが、380近く動画があって気にな …

Rails3.2とBackbone.jsでサーバーサイドのフィルタリング

By: Haldane Martin – CC BY 2.0   テーブルに表示されているデータをサーチバーに入力した語で絞り込みたい こういうテーブルフィルタリングを実現する仕 …

Rails4で複雑な検索〜Ransack

By: eric molina – CC BY 2.0 株価データをつかって複雑な絞り込み検索ができるようにしてみた データは、こちらのサンプルを使わせていただいた datawarehou …