Backbone.js

Backbone.js0.9.10以降のクライアントサイドでのvalidate

投稿日:

参照

backbonejs.org/#Model-validate

stackoverflow.com/questions/14426155/backbone-validate-does-not-work

 

以前の情報 基本的なことが日本語でわかるので

Backbone.js入門 「Model」

 

Model

バリデーション(検証)はModelのvalidateメソッドをオーバーライドして設定する

validateが何かの値を返せば、違反ということになる

違反となると、モデルに対して”invalid”イベントが発行され、インスタンスにvalidationErrorプロパティがセットされる

View

validationErrorをとってもいいけど、invalidイベントを取るとこんな感じ

 

コンソールにはこんな感じでとれる 第2引数に返り値がはいるみたい

 

例えば、こんな実装

Model

返り値をハッシュにして

template

フィールドの横にメッセージエリアを準備しておいて

View

アクションのたびにメッセージをクリアにする

 

setのときvalidateでボタンを押さなくてもバリデーション実行(未完)

saveのタイミングにvalidateメソッドが実行されるけど、setメソッドでもvalidate:trueオプションをつければ、validateが実行される

 

つまり、backbone_datalink.jsをちょっと改造して

としてやれば、フォームの値を変えたとき(たぶんblurして値が変わっていれば)バリデーションが実行されてメッセージが出る

 

ただ、やっぱりこのままだとメッセージが出っぱなしなんで

こんな感じでイベントを設定すれば、メッセージも消える

*ただ、これでもバグがあって

最初のフィールドを入力して、次のフィールドに行くとき、バリデーションが実行されて、まだ入力してないのにエラーメッセージが出てきてむかつくことになる

あと、エラーメッセージが一度に1つしかでない(このへんはvalidateの返り値を変えてやればなんとかなりそう)

いまは考えたくないので、ボタンを押したらバリデーションで満足しておく

たぶん、invalidイベントをやめて、フィールドからchangeかblurするごとにvalidateしてメッセージを取得する

そして、ボタンを押したら全部をバリデーションとかしたらいいんじゃないかという走り書き

-Backbone.js
-

執筆者:

関連記事

Electron+Backbone.jsでボードゲーム〜3目並べ

By: sopasnor – CC BY 2.0 目次1 ボイラープレート2 構想3 盤面の描画4 Marionette.ObjectとBackbone.Radio5 AI6 Done!7 …

no image

Rails3.2でBackbone.jsとPrivate_pubでToDoアプリをリアルタイム化(できた!)

参考 Rails3.2でリアルタイムメッセージング~Private_pub、Faye Rails3.2とBackbone.jsでToDoアプリを作ってみた~backbone-on-rails &nbs …

Todolistをmarionette化

By: Jackie – CC BY 2.0 目次1 Marionette.js2 インストール3 Application4 gulpfile.coffee5 ItemView6 Coll …

Rails3.2とBackbone.jsでサーバーサイドのページネーション

By: Haldane Martin – CC BY 2.0   前提 Rails3.2とBackbone.jsでサーバーサイドのフィルタリング Rails3.2とBackbon …

Backbone.jsで関連するモデルのREADとCREATE

By: woodleywonderworks – CC BY 2.0   ThoughtBotの本を読み進めてるけど私には買ってよかったと感じている ゾンビviewのワナを回避す …