jqueryでpostする時のclassの書き方

  プログラミング >     フロントエンド >  

jQueryでpostしてその結果をjsonで受け取ってバリデーションエラーか正常にPOSTされたかを非同期で表示するとき。

例
html:
＜div id="csrf"＞
＜input type="hidden" value="" ＞
＜span＞＜/span＞
＜/div＞

js:
var param = {
csrf : $('#csrf input').val(),
};

と書くよりも、

html:
＜div＞
＜input type="hidden" value="＜?=$csrf?＞" id="csrf_in"＞
＜span id="csrf_out"＞＜/span＞
＜/div＞
js:
var param = {
csrf : $('#csrf_in').val(),
};

と書くほうが処理が速いし、htmlのデザインが変更したときも対処しやすいという事がわかった。
例えば、あとでレスポンス表示をtableとあわして表示したいときDOM風に値を表示するといちいちJS側でもコードを書き直さないといけない。


書き直さないといけない例
js:
var param = {
csrf : $('#csrf input').val(),
};

↓
var param = {
csrf : $('table tr').siblings('#csrf input').val(),
};

HTMLのデザインの変化に対応できるjqueryでの値の取得方法は一見スマートではないかもしれないけれど、IDとかclassでPOSTするタグとレスポンス表示タグ（主にspan）を1つずつ書いたほうがいいと思った。

by プログラマーこまつ