以前是通过是通过指定validator实现的,比如下面“确定密码”输入框的配置项validator,但发现有个很严重的缺点,如果涉及到后台的话,前台会频繁的访问后台,很浪费资源,于是在此改进了一下。
var PwdEditUi = Ext.extend(Ext.Window, {
title: '修改密码',
width: 400,
height: 180,
layout: 'fit',
modal: true,
initComponent: function () {
this.items = [
{
xtype: 'form',
ref:'form',
baseCls: 'x-plain',
padding: 10,
labelWidth: 70,
id: 'PwdForm',
monitorValid: true,
buttonAlign: 'center',
defaults: { anchor: '95%' },
items: [
{
xtype: 'textfield',
fieldLabel: '用 户 名',
name: 'Teach_username',
allowBlank: false,
blankText: '用户名不能为空!',
emptyText: '请输入用户名',
invalidText: '该用户名已存在!',
listeners: {
'blur': function () {//设置监听函数
PwdEditView.checkname.call(this);
}
}
},
{
xtype: 'textfield',
inputType: 'password',
emptyText: '请输入新密码',
allowBlank: false,
blankText: '新密码不能为空!',
fieldLabel: '新 密 码',
id: 'newPwd'
},
{
xtype: 'textfield',
inputType: 'password',
fieldLabel: '确认新密码',
id: 'affirmPwd',
emptyText: '请输入新密码',
allowBlank: false,
blankText: '确认新密码不能为空!',
invalidText: '两次密码不一致!',
validator: function () {
if (Ext.get('affirmPwd').getValue() == Ext.get('newPwd').getValue())
return true;
return false;
}
},
{
xtype:'hidden',
name: 'Teach_pk'
}
],
buttons: [{
text: '提交',
formBind: true,
iconCls: 'submit',
handler: function () {
PwdEditView.submit();
}
}, {
text: '退出',
iconCls: 'decline',
handler: function () {
PwdEditView.destroy();
}
}]
}
];
PwdEditUi.superclass.initComponent.call(this);
}
});
Ext.override(PwdEditUi, {
//检查用户名
checkname: function () {
var self = this;
var userName = self.getValue();
Ext.Ajax.request({
url: 'JsonPage/TeacherManage.aspx?param=checkname&rnd=' + Math.random(),
params: { username: userName },
success: function (response, options) {
var result = Ext.decode(response.responseText);
if (result.success == true) { //用户名可用
self.markInvalid('用户名已存在,请选择其他用户名!');
self.validator = null;
} else { //用户名已存在
self.markInvalid('用户名已存在,请选择其他用户名!');
self.validator = function () {
return false;
};
}
},
failure: function () {
msg('网络连接出错,请稍后重试!');
self.validator = null;
}
});
}
}); PwdEditView = new PwdEditUi();
PwdEditView.show();