extjs 我的第三个ext程序--窗口-优快云博客

本文介绍了如何使用JavaScript和ExtJS框架构建一个自定义的打印窗口组件，包括其构造函数、继承关系、属性配置和基本操作方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ibeans_ui_printWindow.js:


Ext.namespace("Ibeans.ui");
//构建对象
Ibeans.ui.printWindow = function(_text,_iconCls,_width,_height) { 
	this.iconCls = _iconCls;
	this.text = _text;
	this.width = _width;
	this.height = _height;
	if(!_iconCls) {
	   this.iconCls = 'print-win';
	}
	if(!_text) {
	   this.text = '打印事件';
	}
	if(!_width){
		this.width = 700;
	}
	if(!_height){
		this.height = 450;
	}

	Ibeans.ui.printWindow.superclass.constructor.call(this, {
	      title :  this.text + '窗口',
	      iconCls :  this.iconCls,
	      layout : 'fit',     
	      plain : true,
	      items: {
	          xtype:'box',
	          el: 'word_print',
	          height: '100%'
	      },
	      width : this.width,//700,
	      height: this.height,//450,
	      maximizable:true,
	      minimizable:false,
	      //modal :true,
	      resizable :true,
	      closeAction: 'hide',       
	      buttons : [{
	        text : '取消',
	        handler : this.hide.createDelegate(this, [])
	      }],
	      listeners:{
	      	minimize : function(win){	//窗口最小化处理
	      		//win.setWidth(0);
	      		//win.setHeight(0);
	      		//win.setPosition(this.width-100,this.height-100);
	      		//win.height=20;
	      	}

	      }
	}); 
};


//实现继承
Ext.extend(Ibeans.ui.printWindow, Ext.Window, {
saveOrUpdate : function() {
		if (this.stuffForm.getForm().isValid()) {

			var formvalue = this.stuffForm.form.getValues();

			Ext.MessageBox.show({
				msg : '正在请求数据, 请稍侯',
				progressText : '正在请求数据',
				width : 300,
				wait : true,
				waitConfig : {
					interval : 200
				}
			});

			Ext.Ajax.request({
				url : 'saveStuff.action',
				params : formvalue,
				method : 'POST',
				success : function(response) {
					var r = Ext.decode(response.responseText);
					if (!r.success)
						Ext.Msg.alert("提示信息", "数据保存失败，由以下原因所致：<br/>"+ (r.message));
					else {
						Ext.MessageBox.hide();
						this.hide();
						Ext.Msg.alert("提示信息", "保存成功!", function() {
							this.grid.refresh();
						}, this);
					}
				},
				scope : this
			});

		}
	},

delete:function(){
//
}
});

可以用以下代码应用以上构建的窗口程序


var printWin = new Ibeans.ui.printWindow(_title,null,null,null);
printWin.show();

注意：
在创建Window时如果不指定el属性在close后就可以重构，如果设置了el属性在销毁时会把相应的div也销毁因此会出现this.el.dom 为空或不是对象。这时可以采用hide方式来处理window。