ExtJs封闭面板时清空面板中的内容

ExtJs关闭面板时清空面板中的内容

在用ExtJs写前台代码时,一些控件在关闭时需要设置他的关闭为隐藏,方便下次继续使用,但是如果用户在填写完信息后直接关闭下次打开后信息继续存在,影响用户体验。可以通过以下解决方案,设置关闭按钮的监听事件,当用户点击关闭按钮后清空对应formpanel中的数据。

下面首先看一个formPanel,实现添加用户界面。

var addUser = new Ext.form.FormPanel({
	labelAlign:'center',
	labelWidth:50,
	frame:true,
	defaultType : 'textfield',
	items: [{
    	fieldLabel:'用户名',
    	name:'userName'
    },{
    	fieldLabel:'用户密码',
    	name:'userPWD'
    },{
    	fieldLabel:'用户区域',
    	name:'userRegion'
    }]
});
然后看存放该formPanel的window。

var addUserswin = new Ext.Window({
	title: '添加用户',
    height: 200,
    width: 400,
    constrainHeader:true,
    buttonAlign:'center',
    closeAction:'hide',
    items:[addUser],
    buttons:[{
    	text:'新增',
    	handler:function(){
    		Ext.Msg.alert("ff","执行新增方法");
    	}
    }]	
});
然后添加这个window的关闭按钮监听事件。

addUserswin.on('close',function(){
	addUser.getForm().reset();
});
这就在关闭按钮前清空formpanel中的内容。