・フォーム内のテキストフィールドでエンターキーを押した時にSubmitせずにJavascriptコードを実行させる方法
フォーム内のテキストフィールドでエンターキーが入力された場合、通常はSubmitが実行され、
フォーム内のデータがすべてサーバに送られる。
そうしないでエンターキーが押された時にフォームの一部をAjaxで書き換えるだけにしたい場合はどうすればいいか?というのが今回のお題。
色々と調べた結果、エンターキーを押してもSubmitさせないJavascriptコードを発見。
エンターキーの押下でフォームの送信を行わないようにする : blog.nomadscafe.jp
これとAjaxのコードを組み合わせて最終的には以下のコードになった。
//テキストフィールドでエンターキーを入力してもフォームの内容がsubmitされないようにする function BlockEnter(evt){ evt = (evt) ? evt : event; var charCode=(evt.charCode) ? evt.charCode : ((evt.which) ? evt.which : evt.keyCode); if ( Number(charCode) == 13 || Number(charCode) == 3) { return false; } else { return true; } } //テキストフィールドでエンターキーが押された場合、submitする代わりにAjaxリクエストを送信する function SendOnlyAjaxRequest(event){ if (event.keyCode == Event.KEY_RETURN) { new Ajax.Request('/movie/search', { asynchronous: true, evalScripts: true, onComplete: function(request){ $('select-people').update(request.responseText) }, parameters: Form.serialize('search_people') }); } return BlockEnter(event); }
これをtext_field_tag内のonkeydownイベントで実行させる。
:onkeydown => "return SendOnlyAjaxRequest(event);"
これでOK。
・findメソッドではまる
モデルクラスのfindメソッドで:allを指定するとすべてのカラムのデータを取ってくる。
:selectでカラムを指定すると指定したカラムのデータだけを取ってくる。
両方を使うと:selectの方が優先される。
今回は:selectでidカラムを指定するのを忘れてidが取ってこれずエラーになった。
これを防ぐにはどうすればいいか。。解決策は
・単体テストでDBから取ってきたデータをテスト
・SQLやHTMLを生成するRailsコードを書いたら必ず生成されたSQLやHTMLを確認する
ぐらいかな。