我想添加一个简单的验证器来验证“密码”和“确认密码”是否相等,这里是代码:
Ext.apply('Ext.form.VTypes',{
password : function(val, field) {
if (field.initialPassField) {
var pwd = Ext.getCmp(field.initialPassField);
return (val == pwd.getValue());
}
return true;
},
passwordText : 'Passwords do not match'
});
var genders = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data : [
{"abbr":"AL", "name":"Male"},
{"abbr":"AK", "name":"Female"}
]
});
//****************************************
Ext.define('AM.view.user.Inscription', {
extend: 'Ext.form.Panel',
alias: 'widget.inscription',
title: 'Formulaire',
fieldDefaults: {
labelAlign: 'right',
msgTarget: 'side'
},
items: [{
xtype: 'container',
anchor: '100%',
layout:'column',
items:[{
xtype:'textfield',
fieldLabel: 'First Name',
name: 'first',
allowBlank:false,
anchor:'40%',
//maxLength : '10'
},{
xtype:'textfield',
fieldLabel: 'Last Name',
name: 'last',
allowBlank:false,
anchor:'40%'
},{
xtype:'textfield',
inputType: 'password',
fieldLabel:'Password',
name:'pass',
id : 'pass',
allowBlank:false,
anchor:'40%'
},{
xtype:'textfield',
inputType: 'password',
fieldLabel:'Confirm Password',
name:'confirmPass',
allowBlank:false,
vtype : 'password',
initialPassField : 'pass',
//autoRender : true,
anchor:'40%'
}]
},{
xtype: 'container',
columnWidth:.5,
layout: 'anchor',
items: [{
xty pe:'combobox',
fieldLabel: 'Sexe',
store: genders,
queryMode: 'local',
displayField: 'name',
allowBlank : false,
name: 'gender',
editable : false,
anchor:'30%',
},{
xtype:'textfield',
fieldLabel: 'N° Téléphone',
name: 'phone',
allowBlank:false,
anchor:'40%'
}]
}]
}],
buttons: [{
text: 'Save'
},{
text: 'Reset'
},{
text: 'Cancel'
}]
});
我开始在确认密码文本字段中写道我在chrome开发人员工具中得到了这个:
Uncaught TypeError: Object [object Object] has no method 'password'
更新
应用程序是一个MVC应用程序,这个文件(上面的代码)在View文件夹中,我在app.js中调用这个视图,如下所示:
Ext.require([
'Ext.panel.*',
'Ext.toolbar.*',
'Ext.button.*',
'Ext.container.ButtonGroup',
'Ext.layout.container.Table'
]);
Ext.application({
name: 'AM',
appFolder: 'app',
controllers: [
'Users'
],
launch: function() {
Ext.create('Ext.container.Viewport', {
layout : 'auto',
//layout : 'vbox',
renderTo: document.body,
items: [{
xtype : 'usertoolbar',
},{
html : '<br><br>'
},{
xtype: 'inscription',
},{
xtype: 'userlist',
}]
});
}
});
欢迎任何有关我的代码构造方法的说明
答案 0 :(得分:1)
在第一行中将Ext.form.VTypes更改为Ext.form.field.VTypes。看看它是否有帮助。
更新:将验证功能更改为:
password : function(val, field) {
console.log(val, field);
if (field.initialPassField) {
var pwd = Ext.getCmp(field.initialPassField);
console.log(pwd);
return (val == pwd.getValue());
}
return true;
},
答案 1 :(得分:0)
将Ext.form.VTypes
更改为Ext.form.field.VTypes
。并尝试删除'Ext.form.field.VTypes'
周围的引号。 E.g:
Ext.apply(Ext.form.field.VTypes, {
password : function(val, field) {
if (field.initialPassField) {
var pwd = Ext.getCmp(field.initialPassField);
return (val == pwd.getValue());
}
return true;
}
答案 2 :(得分:0)
解决方案是删除&#39; Ext.form.field.VTypes&#39;
周围的引号Ext.apply(Ext.form.field.VTypes, {
password: function (val, field) {
if (field.initialPassField) {
var pwd = Ext.getCmp(field.initialPassField);
return (val == pwd.getValue());
}
return true;
},
passwordText: 'Passwords do not match'
});