我有一个ember-app-kit应用程序。对于我使用ember默认视图的表单。但是对于表单验证,我遇到过这个lib,每个人都强烈推荐。 Ember Validations By Docyard。但我不知道如何在我的eak设置中实现相同的功能。
我的问题: 1.我应该在哪里添加验证? 2.定义验证时要声明的内容? 3.错误如何在焦点上或甚至在提交按钮上显示它们?
比如说我有一个注册表单,我想验证名字姓氏,电子邮件,密码,性别(选择选项)。我应该怎么做呢?
如果可能,请使用JSbin澄清查询。
答案 0 :(得分:2)
除非您使用可以复制的动态表单集,否则验证应该转到控制器。你还必须将ControllerObject包装到这个
中var AddController = Ember.ArrayController.extend(Ember.Validations.Mixin,{}
要开始验证,您必须创建新的Object named validations
您必须添加要验证的输入值
validations: {
newFirstname:{
format: { with: /^[A-Za-z-]{2,16}$/, allowBlank: true, message: 'Enter valid name.' }
},
newFamilyname: {
format: { with: /^[A-Za-z-]{3,16}$/ , message: 'Required field lastname.' }
}
},
显示错误。
<div class="row">
<div class="col-md-6 col-xs-4">
<label>First name: </label>
{{input type="text" placeholder="First name" value=newFirstname class="form-control"}}
{{#if errors.newFirstname}}
<span class="error errorForValidation"><span class="glyphicon glyphicon-warning-sign"></span> {{errors.newFirstname}}</span>
{{/if}}
</div>
<div class="col-md-6 col-xs-4">
<label>*Last name: </label>
{{input type="text" placeholder="Family name" value=newFamilyname class="form-control"}}
{{#if errors.newFamilyname}}
<span class="error"><span class="glyphicon glyphicon-warning-sign"></span> {{errors.newFamilyname}}</span>
{{/if}}
</div>
</div><!--end row-->
验证完美无缺时显示按钮
<button type="submit" class="btn btn-primary" {{bind-attr disabled="isInvalid"}}{{action 'GetData'}}>Create</button>