2016-09-09 5 views
6

Ember 1.7を使用しており、検証済みのモデルがあります。Ember検証が遅すぎます

入力ヘルパーを使用して、私はアクションをon="key-press"トリガーにバインドします。

(私のコントローラ内で)起動されたアクションでは、私はthis.get('myModalInstance').validate()を呼び出していますが、ハンドラの設定が合格で失敗しました。

奇妙なことは、私が入力した以前の値で検証が開始されたようだということです。だから、

私の検証は私が9を入力numericality: { greaterThan: 0, lessThanOrEqualTo: 90 }とき、それは私が91で入力すると、それは[OK]を検証し、私は911で入力すると、それが検証に失敗し、[OK]を検証しますと言います。

これは私が見る限り、キーの押下が遅すぎるようです。これは既知の/よくある問題ですか?この問題を回避するためのヒントはありますか?私はまた、エラーのために私の検証失敗のCSSクラスをバインドしようとしたことを追加する必要があります

EDIT は、このようなフィールドのオブジェクト:

(例えば時々、奇妙な行動を表示している
{{input value=myValue classBinding=":form-input myValue.errors:validation-failure"}} 

クラスをまったく適用しない場合があります(例えば、presence: trueが設定されている入力のコンテンツを削除するなど)、フォーム上の別のコントロールを変更すると検証することがあります。

+0

値が変更される前に(キーの押下)何らかの理由で「キーア​​ップ」と「キーダウン」が全く発動しない:/ – dougajmcdonald

答えて

2

もしあなたが弱ければkeypressイベントが必要です更新時にいくつかの値(またはいくつか)を検証します。 observerを使用してください(「Observers and asynchrony」のセクションを完全に読んでください。それは非常に重要で、そのような遅れを避ける方法を示しています)。興味のあるフィールドの変更を観察し、検証してください。

jquery検証プラグインの1つを使用する場合は、componentを作成し、たとえばvalidated-formと呼び、jqueryプラグインを使用して検証することができます。これらのプラグインは通常、必要なすべてのイベントを処理します。そのようなコンポーネントの簡易版(thisプラグインで動作するはずです):

import Ember from 'ember'; 

export default Ember.Component.extend({ 
    tagName: 'form', 
    onSubmit: null, 
    validationRules: {}, 
    validationMessages: {}, 
    didInsertElement() { 
     const form = this.$(); 
     form.validate({ 
      submitHandler:() => { 
       if (this.get('onSubmit')) { 
        this.sendAction('onSubmit'); 
       } 
      }, 
      rules: this.get('validationRules'), 
      messages: this.get('validationMessages') 
     }); 
    } 
}); 

そして、テンプレートで、あなたはこのようにそれを使用する:あなたはあなたのソリューションが動作しない理由に興味がある場合は

{{#validated-form validationRules=validationRules}} 
    Form fields here 
{{/validated-form}} 

、私はこれがEmberの入力コンポーネントがinputイベントを使用してバインドされた値を更新するためだと考えています。keypress

+0

ポインタをありがとう、私はこれを行かせる。非エバーバックグラウンドから来た私の考えは、何らかのイベントでバリデーションを呼び出す必要があるということでした。おそらく擬似ロジックは次のようなものになるでしょう:オブザーバーフィールドx - >フィールドxの検証 - >エラーチェックプロパティ - >バインドされたcssクラスを検証の結果に設定しますか? – dougajmcdonald

+0

@dougajmcdonaldはい、そのようなsmth –

+0

検証は私のモデルで自動的に実行されるようです。だから、実際には私がする必要があったのは、CSSクラスを正しくバインドすることでした。 – dougajmcdonald

関連する問題