by shigemk2

当面は技術的なことしか書かない

javascriptの記述場所

ありのまま今起こったことを話すシリーズ。
一応解決した問題だけど、うまく説明できないけど
なんとか説明してみます。

ビューファイルにjavascriptを記述する場合、どこに書いたらいいのか、という問題について。

Ajaxで別のファイルを呼び出したいというとき、
そのファイルを何度も呼び出したいというときがある。

1. 例えば、画像一覧ページなどで、今画像10表示されている。
(そのページはjQueryを使い、モーダルウィンドウで出す。
まず最初にjQueryでリンクをクリックしたら空のモーダルウィンドウを表示させるようにし、
次にAjaxを使って画像を表示するビューファイルをモーダルに表示させる)

2. moreのリンククリックでさらに10表示される機能を付ける、とする。

3. それぞれの画像には、画像の情報をダイアログで表示するリンクがついている(関数名の例:show_data_image)
なお、リンクの属性はidとしている。
複数の異なる画像を表示させているので、classにしてしまうとどの画像なのか認識できなくなるから。
この時点で、live関数とclick関数のコンボでダイアログを表示させる関数を使うのは不可能となる。
こちらのエントリも参考に。live関数は、classのセレクタじゃないと使えない。
live関数 - by shigemk2

4. ダイアログを呼び出すために、html->linkを使い、かつonclickを利用し、jQueryでダイアログを表示させる関数を呼び出すことにする。

5. なぜかready関数を使ってもダイアログは表示されなかったので、noConflictを利用し、$の中身はjQueryオブジェクトであることを明示する。
noConflict - by shigemk2

ここで、ダイアログを表示させる関数はどこで記述したらいいかという問題が発生する。

記述場所はモーダルウィンドウを表示させているビューファイルがいいのか、それともモーダルの中身を表示させているビューファイルなのか、
という問題である。

両方のビューファイルに関数を記述しても、二重に関数を定義になるので無駄である(そもそも書く必要がない)

画像をクリックしたらダイアログが表示されるので、可読性の問題から、モーダルの中身のビューファイルに
関数は記述したほうが良いと思われる。