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
-, ,

執筆者:

関連記事

Railsでhtmlファイルやリンク先のスクリーンショットを撮影~IMGKit&wkhtmltoimage

  github.com/csquared/IMGKit 目次1 環境2 wkhtmltoimageのインストール3 imgkitのインストール4 試す5 日本語フォント 環境 ubuntu …

Rails3.2のアプリをデプロイ~apache+passenger+postgresql

  環境 ubuntu server 12.04 目次1 postgresql2 apache+passenger3 デプロイ準備 postgresql インストール 参照 Ubuntu s …

Rails3.2とBackbone.jsでサーバーサイドのページネーション

By: Haldane Martin – CC BY 2.0   前提 Rails3.2とBackbone.jsでサーバーサイドのフィルタリング Rails3.2とBackbon …

no image

Railsで動画ファイルを管理する~CarrierWave Flowplayer

  参考 Ruby on Rails 3.2でファイルアップロード〜CarrierWave & RMagick Rails3で動画配信を試用~flowplayer 環境 Ubuntu …

no image

Ubuntu ServerのGuardからネットワーク経由でWindowsのブラウザをリロードする~guard-livereload

Ubuntu12.04.1でCoffeeScriptの自動makeとブラウザの自動リロード~guard-coffeescript   Ubuntu ServerのGuardからGrowl f …