ExtJs－３５ validateについて

今日は少し時間が取れました。

ASP.NETのvalidatesummary?みたいに集約してエラー出したいなって場面が出てきました。
画面構成上、タブパネルで入力させるかたちになってるんですが、
ほかのタブに必須項目とかあると集約したエラー情報がないと
背面のタブで発生しているエラー情報が見えないわけで。
フォーム中のバリデータに引っかかったものってアンダーラインで表示されたり。
でわかるんですが、
一部の方々は「なんじゃこの赤いアンダーラインは？」
で思考がとまるケースもあるんじゃないかな。。。
そのためのqtipに出してもそうなるばあいもあるんでしょうね。多分。


で、summaryに吐き出すみたいなことってできないのでしょうか？
ってことでデータを覗いてみるテスト。
ExtJs内部でもform.items.をぶんまわしてvalidateでみて引っかかればfalse
で返しているぶぶんがあったので。。。。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
this.items.each(function(f){
if(!f.validate()){
valid = false;
}
});
//フィールドf.validateって
getRawValueで持ってきてチェックしている。
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
ってことはそれを捕まえられればいいわけだ。
①イベントを調べよう。
②フォームの中を見てみよう。
となるわけです。

①APIリファレンス見ると、、actionfailedってやつがありました！！
ですのでFormPanelのInitComponentで
this.on('actionfailed', this.onActionFailed, this );
こんな具合に登録を。

②に中をのぞくってことでイベントリスナーの実装で。
まだテストじっそうなので煩雑だけど一応こんなかんじなんだろうな。
onActionFailed: function( form, action )
{
var invalidateSummary = '';
//フォームのアイテムを回してだめなやつのinvalideTextを参照する。
form.items.each(function(field){
// なかで情報取得してチェックしているので
if(!field.validate()){
//
invalidateSummary = invalidateSummary + field.name + ':' + field.invalidText + '
';
}
});
　　}

あとは一番最初に引っかかったコントロールにフォーカスをあわせてやる。
ってことでどうだろう。これをプラグインにしてサマリコントロールとして汎用にしてとか。
これはまた後日。

ちょっとすっきりした。