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

如果选择选择为空或未定义,我通过扩展 Ember.Select 并根据结果绑定有效或无效类以非常相似的方式实现了这一点。我不确定这是否是最好的解决方案,所以如果您知道更好的方法,请告诉我。这很快,但对我来说效果很好。

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 回答
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 回答