ひぐかつのブログ

ひぐかつのブログ

ブログの説明を入力します。

Amebaでブログを始めよう!
今、Rails 3.0.4とjquery mobile 1.0.1を使用して、スマホ向けページを作成しているんだけども、
まず、Railsとjquery mobileのajaxの相性が悪いという記事をいたるところで発見したので、

http://kitbc.s41.xrea.com/main/?jquery_mobile_tips

上のページに書いてある通りに、

Railsのlayoutページのheader内で上記ページ内のjsファイルを、

1. jquery
2. 作成したjs
3. jquery mobile

の順で読み込ませることによって、

全体としてajaxを使わない設定にすることが出来た。

が、個別のリンクやボタン押下時にどうしてもajaxを使う必要があるため、

Railsの仕組みである、

link_to("hoge", :hoge, :remote => true)

を設定して、リンクを押下したところ、

ActionView::MissingTemplate (Missing template・・・

が表示されてしまった。。

Railsの仕組み上、remote => trueを指定すると、レンダリングするテンプレートが、

hoge.js.erbを読み込みに行ってくれるのだが、

hoge.html.erbを読み込みに行ってしまい、エラーになった模様。

さてどうする。。。

う~ん、とりあえずぐぐってみる。

お!!!

http://stackoverflow.com/questions/9202233/rails3-jquery-mobile-and-remote-true-ajax-calls-processing-as-html

同じこと考えてる人は世界を探すといるものですね。

こういうとき英語ちょっと読めてよかったと思うw

要するに、

jquery mobileを使っている際に、Railsのconfig/initializers/mime_types.rbに

モバイル用のtext/htmlのmime_typeを追加して、

application_controller.rbにユーザエージェントを判別して、

上記mime_typeを設定するメソッドを追加した際に、

request.formatがhtmlだろうが、jsだろうが、text/htmlのmime_typeを指定していたのが原因。

なので、今回新しくtext/javascriptのスマホ用のmime_typeを追加して、

「ユーザーエージェントがスマホ用かつ、request.formatがjsの場合は、スマホ用js mime_typeを設定する」

という書き方にしたところ、無事に意図するテンプレートをレンダリングしてくれました。

よかったー。