嵌り実況
- ファイルをアップロードする画面が必要になった。intra-mart Accel Platform 上なので当然
imuiFileUpload
を使うことを考える。 - ただアップロードするだけじゃなく、アップロードに際していくつか入力する項目が付属するので、ファイルは
imuiFileUpload
に任せて、imuiFileUpload
がアップロードしたファイルについての情報と付属項目を一緒に<form>
にいれてimuiAjaxSend
で送信するのが楽そう、と考える。 - 画面全体を
<form>
で囲ったらimuiFileUpload
のスタイルが剥がれて、おそらくまともに動作していない状態になった。- ファイルをアップロードする性質上フォームとは相性が悪いのか?
- 選択肢としてありそうなのは
imuiFileUpload
のouterFormId
属性の指定。- でもこれって単にマルチパートとして送信してしまうのでは?
- 別にそれでもいいんだけど、
imuiFileUpload
がサーバサイドで Session Scope Storage に自動的に保存してくれる機能を活かしたい
- とりあえず、全ての値を
hidden
で保持するフォームを作成して、入力された値はそこに転記してimuiAjaxSend
することにしようと考える。 - でも入力値はバリデーションしたいので、上記の転記先のフォームに対して
imuiValidate
のルールを定義して呼び出してみる。- エラーメッセージ表示は関数を与えることでコントロールできるので、バリデーション対象が
hidden
でもいけると踏んだ
- エラーメッセージ表示は関数を与えることでコントロールできるので、バリデーション対象が
- 何を入力してもまったくバリデーションエラーにならない(入力値に何を入れても
imuiValidate
の戻り値がtrue
) jQuery validation plugin hidden
でGoogle検索したらデフォルトではhidden
項目はバリデーションの対象にしないらしいことが分かる。これを無効にするにはバリデーションを無視する項目を指定する引数に[]
(空配列)を渡せばよいらしいことが書いてある。- 与えてみるが何も変わらない。
- DOMエレメントツリーを見ていると上記の転記先の
<form>
にnovalidate
なる属性が付与されていることを発見する。 - 調べてみると html5 の機能でバリデーションを無効にする指定らしい。StackOverFlowにてjQueryのvalidation pluginも何らかの条件下でこの属性を付与するようで困るというようなポストを見つけた。
- StackOverFlowの同スレッドにて
$("#form").removeAttr("novalidate")
せよとのポストが見つかったので試してみるもnovalidate
はなくなるが(あたりまえ)動作には変化ない。 - ここまで書いたところでふと思い当たってバリデーション無視対象を
[]
でなく''
にしてみる
・・・やっと imuiValidate
がエラーを返してきた。[-_-]
敗因は?
ファイルアップロードが中途半端に混ざってる画面設計か、もしくは4で outerFormId
使うほうを選んでたらもっと簡単に解決したのだろうか(試してない)。 あとはバリデーション無視対象はString型だよ、と一応公式ドキュメントには書いてあるので、それを見逃した点かな…。