model
1 Ext.define('app.model.Register', {
2 extend: 'Ext.data.Model',
3 requires: ['Ext.data.JsonP'],
4 config: {
5 fields: [{
6 name: 'mobile',
7 type: 'int'
8 },
9 {
10 name: 'verifycode',
11 type: 'int'
12 },
13 {
14 name: 'email',
15 type: 'string'
16 },
17 {
18 name: 'password',
19 type: 'string'
20 },
21 {
22 name: 'passwordTwo',
23 type: 'string'
24 },
25 {
26 name: 'realname',
27 type: 'string'
28 },
29 {
30 name: 'cityid',
31 type: 'int'
32 },
33 {
34 name: 'address',
35 type: 'string'
36 },
37 {
38 name: 'sex',
39 type: 'int'
40 },
41 {
42 name: 'tService',
43 type: 'string'
44 }],
45 validations: [{
46 field: 'realname',
47 type: 'presence',
48 message: '请输入姓名!'
49 },
50 {
51 field: 'password',
52 type: 'presence',
53 message: '请输入密码!'
54 },
55 {
56 field: 'email',
57 type: 'email',
58 message: '请输入正确的邮箱地址!'
59 },
60 {
61 field: 'verifycode',
62 type: 'presence',
63 message: '请输入验证码!'
64 },
65 {
66 field: 'mobile',
67 type: 'format',
68 matcher: /^(1(([35][0-9])|(47)|[8][0126789]))\d{8}$/,
69 message: '请输入11位手机号码!'
70 }]
71 },
72 //添加自定义验证
73 validate: function (options) {
74 var me = this,
75 errors = me.callParent(arguments),
76 tService = this.get('tService'),
77 password = this.get('password'),
78 passwordConfirm = this.get('passwordTwo');
79 if (password != passwordConfirm) {
80 errors.add({
81 field: 'passwordConfirm',
82 message: '两次密码输入不一致!'
83 })
84 }
85 if (tService == 'O') {
86 if (this.get('address') == '') {
87 errors.add({
88 field: 'address',
89 message: '请输入地址!'
90 })
91 }
92 }
93 return errors;
94 }
95 });视图：
1 Ext.define("app.view.user.Register", {
2 alternateClassName: 'userRegister',
3 extend: 'Ext.form.Panel',
4 xtype: 'userRegister',
5 requires: ['Ext.form.FieldSet', 'Ext.field.Password', 'Ext.field.Email', 'Ext.field.Select', 'Ext.field.Radio', 'Ext.field.Hidden'],
6 config: {
7 padding: 10,
8 title: '注册',
9 cls: 'fromPanel',
10 items: [{
11 xtype: 'hiddenfield',
12 itemId: 'tService',
13 name: 'tService'
14 },
15 {
16 xtype: 'fieldset',
17 iconCls: 'home',
18 defaults: {
19 labelWidth: '40%'
20 },
21 items: [{
22 xtype: 'textfield',
23 name: 'mobile',
24 placeHolder: '手机号码(点图标取验证码)',
25 cls: 'user ico x-field-clearable'
26 },
27 {
28 xtype: 'textfield',
29 name: 'verifycode',
30 placeHolder: '验证码'
31 }]
32 },
33 {
34 xtype: 'fieldset',
35 iconCls: 'home',
36 defaults: {
37 labelWidth: '40%'
38 },
39 items: [{
40 xtype: 'emailfield',
41 name: 'email',
42 placeHolder: '电子邮件'
43 },
44 {
45 xtype: 'passwordfield',
46 name: 'password',
47 placeHolder: '密码'
48 },
49 {
50 xtype: 'passwordfield',
51 name: 'passwordTwo',
52 placeHolder: '再次输入密码'
53 },
54 {
55 xtype: 'textfield',
56 name: 'realname',
57 placeHolder: '姓名'
58 },
59 {
60 xtype: 'selectfield',
61 name: 'cityid',
62 itemId: 'cityid',
63 valueField: 'areaCode',
64 displayField: 'cityname'
65 },
66 {
67 itemId: 'address',
68 xtype: 'textfield',
69 name: 'address',
70 placeHolder: '详细地址'
71 },
72 {
73 layout: 'hbox',
74 items: [{
75 xtype: 'radiofield',
76 name: 'sex',
77 value: '1',
78 label: '男',
79 checked: true,
80 flex: 1
81 },
82 {
83 xtype: 'radiofield',
84 name: 'sex',
85 value: '0',
86 label: '女',
87 flex: 1
88 }]
89 }]
90 },
91 {
92 xtype: 'button',
93 action: 'register',
94 text: '提交注册',
95 ui: 'action'
96 }]
97 }
98 });验证代码：
var valid = myUtil.valid('app.model.User', this.getUserLogin());验证代码中调用的公用类：
1 /*公共类*/
2 Ext.define('myUtil', {
3 statics: {
4 /*为Ext.Viewport添加一个消息提示组件*/
5 addMessage: function () {
6 Ext.Viewport.setMasked({
7 xtype: 'loadmask',
8 cls: 'message',
9 transparent: true,
10 indicator: false
11 });
12 this.hideMessage();
13 },
14 /*显示一个消息提示*/
15 showMessage: function (mes, autoHide) {
16 var me = this, message = this.getMessage();
17 message.setMessage(mes);
18 message.show();
19 //是否自动关闭提示
20 if (autoHide) {
21 setTimeout(function () {
22 message.hide();
23 },
24 500);
25 }
26 },
27 /*隐藏消息提示*/
28 hideMessage: function () {
29 this.getMessage().hide();
30 },
31 //消息组件
32 getMessage: function () {
33 return Ext.Viewport.getMasked();
34 },
35 //验证模型
36 valid: function (model, from) {
37 var tmpModel = Ext.create(model),
38 me = this,
39 errors, valid;
40 from.updateRecord(tmpModel);
41 errors = tmpModel.validate();
42 valid = errors.isValid();
43 if (!valid) {
44 errors.each(function (err) {
45 me.showMessage(err.getMessage(), true);
46 return;
47 });
48 }
49 return valid;
50 }
51 }
52 });
