RailsでTwitterBootstrap Railsで使えるGem

Rails3でTwitter Bootstrapのサーチフォームを実装する~form_tag

投稿日:

git & gitolite

最近、gitoliteでソース管理をはじめたので、今までの変更をコミットした後、新しいブランチにチェックアウトする

と言ってもデスクトップとMBAでサンプルアプリのソースを行き来しているだけだが

 

仕組みを考える

参考 #240 Search, Sort, Paginate with AJAX @RailsCasts

特に考えることがないほど、Head First Railsにもあったような簡単なサーチフォーム

モデルに関係ないform_tagからparams[:search]という名前で検索語を投げてindexを呼んで、コントローラかモデルでMySQLのLIKEクエリを投げればよい

図形はGoogleドライブで作成した

フィーチャの作成

今回はテストファーストでフィーチャからフィーチャで使える(認識される)日本語はコマンド cucumber --i18n jaで一覧できる

こんなかんじで

ステップは今までのでいらないはず

最初、マッチしないなあと思っていたら、ページを表示するのを忘れていた

StackOverflowに同じ相談している人がいて気づいた

Viewの作成

Twitter Bootstrapのページから適当に実装する

form_tagなのでsimple_formはつかえない

これでfill_in ‘search’を認識した

Controllerの作成

基本的にはWHERE title LIKE %query% っていうSQLを渡せばいいんだけど、queryが空のときの処理が必要

searchって名前のメソッドを作って処理する

ちなみにLIKE検索は重いしスペース区切りしない日本語に向いてないので、もっと長い日本語やスピードを求めるときは転置インデックスをつけたりする方法を考えなければならない

方法とすると、hyper estraierやsolrのような全文検索を別に用意するか、PostgreSQLのtextsearch_jaとかMySQLのTritonnとかのプラグイン、groongaなどのストレージエンジンを使うなどがある

まあどれもハードルがそこそこ高いので今回はパスした

Modelの作成

elseの処理がscopedなのはページネーションを使ってるから

テストが通らない!

ここまでで完成のはずだけどテストが通らない

なぜなら検索ボタンを押しても、並び替えが機能して逆順に並んでしまうから

ぬぅ

セッションをあきらめて、hidden_formでパラメータを送ってきたときだけ処理することにして、送るパラメータはヘルパーで書くことにした

mergeして終わり

テストが通ったらmastarにmergeして終わり

ホントはテストが通らない時点で、もとのコミットまで戻ってから新しいブランチを作りなおして、並び替え機能をリファクタリングしてから、マージしなきゃいけないんだろうな

とりあえずTwitter Bootstrapが適用されていて、Validationとかもきれいに表示されて、並び替えとページネーションと絞込みができるテーブルがついたひな形がテスト付きで作成できたので満足した

ajax化しておきたいが、テストが軒並み通じなくなるので留保

つぎは関連性を表現するモデルとそのビューをひと通りやってみたい

-RailsでTwitterBootstrap, Railsで使えるGem
-, ,

執筆者:

関連記事

Rails3.2のproduction環境で動画再生~flowplayer+carrierwave+nginx+unicorn

  By: Creative Tools – CC BY 2.0 目次1 前提2 unicornの設定3 nginxのインストール4 nginxの設定5 アセット関係6  ストリ …

Rails3.2.8でテーブル並び替えのテストを作る~cucumberと正規表現

前提 Railsのテーブル並び替えを実装する Rails3.2.8で自動テスト環境を整える〜cucumber+spork+guard 目次1 作戦(ストラテジー)2 have_contentの正規表現 …

Ubuntu ServerのGuardからGrowl for Windowsにネットワーク経由で通知する

github.com/guard/guard 普段はWindows7から仮想環境(VirtualBox)のUbuntu Server 12.04.1へputtyで接続して開発してます. Virtual …

no image

kaminari + Twitter Bootstrap2テーマでFirst,Prev,Next,Lastだけおかしい場合

前につくったTwitter Bootstrap2用のkaminariテーマをコピーして使おうとしたら表題の通り、First,Prev,Next,Lastがおかしい あと…も表示されない G …

Rails4.2で簡単にマテリアルデザインを使えるmatelializeを試してみた〜matelialize

By: Basheer Tome – CC BY 2.0 目次1 マテリアルデザイン2 matelialize3 Gemfile4 application.scss5 applicatio …