0

以下のコードを使用して、TextField が空か 0 かを検証し、エラー クラスを追加して背景色を指定しています。

非表示の別のテキスト フィールドがあり、Ember.Select で選択された内容に基づいて値が設定されています。値が選択されていない場合、選択のエラー クラスを追加/変更するにはどうすればよいですか?

App.NumField = Ember.TextField.extend({
  required: function() {
    var valid = /^[1-9][0-9]*$/.test(this.get('value'));
    return valid
  }.property('value'),
  classNameBindings: 'required:notreq:req'
});

{{view App.NumField valueBinding="type"}}
{{view Ember.Select contentBinding="App.Type" optionValuePath="content.id" optionLabelPath="content.type" valueBinding="type" prompt="Please select a type"}}

アドバイスをありがとう。

4

3 に答える 3

0

parsleyjsを CLI プロジェクトに統合する作業をしている場合は、次のように設定します。かなりの数の属性があります。

次のように作成initializers/reopen-textfield.js:

export default {
  name: 'textfield-configuration',
  initialize: function() {
    Ember.TextField.reopen({
      attributeBindings: [
        'parsley-type',
        'parsley-required-message',
        'parsley-type-email-message',
        'required',
        'placeholder'
      ]
    });
  }
};

次のように作成initializers/reopen-checkbox.js:

export default {
  name: 'checkbox-configuration',
  initialize: function() {
    Ember.Checkbox.reopen({
      attributeBindings: [
        'parsley-type',
        'parsley-required-message',
        'parsley-type-email-message',
        'parsley-group',
        'required',
        'placeholder'
      ]
    });
  }
};

私はember cliプロジェクトを使用して、ember アプリケーションを構築しています。

この記事の時点での現在のセットアップ:

DEBUG: -------------------------------
DEBUG: Ember      : 1.5.1 vendor.js:15554
DEBUG: Ember Data : 1.0.0-beta.8.2a68c63a vendor.js:15554
DEBUG: Handlebars : 1.3.0 vendor.js:1555
DEBUG: jQuery     : 2.1.1
DEBUG: -------------------------------
于 2014-06-24T06:11:43.947 に答える
0

Parsley.js ( http://parsleyjs.org/ ) を使用してフォームを検証し、それと組み合わせて、Ember.Select クラスを拡張して「required」属性と「parsley-error-message」属性を含めるだけです。バインディングで使用できます。

Ember.Select.reopen({
    attributeBindings: ['required', 'data-error-message']
});

{{view Ember.Select
contentBinding="[Your Val]"
optionValuePath="[Your Val]"
optionLabelPath="[Your Val]"
valueBinding="[Your Val]"
prompt="Choose Option"
required="required"
data-error-message="Please select an option."}}

したがって、parsleyjs.org のドキュメントを見ると、より多くのパセリ検証シナリオを処理するようにコントロールを拡張する方法がわかります。これはよくできたライブラリです。

于 2014-01-16T03:26:22.510 に答える
0

これは、Ember.Select を拡張し、select 選択が null または未定義の場合の結果に基づいて有効または無効なクラスをバインドすることで、非常によく似た方法で実現しました。これが最善の解決策かどうかはわかりませんが、より良い方法を知っている場合はお知らせください。これは迅速で、私にとってはうまく機能します。

App.SelectValidate = Ember.Select.extend({
    validate: function() {
        var chosen = this.selection,
            valid;
        if (chosen === null || chosen === undefined) {
            valid = false;
        } else {
            valid = true;
        }
        return valid
    }.property('value'),
    classNameBindings: 'validate:valid:invalid'
});
于 2013-09-04T21:07:28.060 に答える