扩展Ext.BasicDialog（dialog封装）

html:

<div id=“updateDialog" style="position:absolute;display:none"> 
  <div class=“x-dlg-hd”>人员信息修改</div> 
  <div class="x-dlg-bd"> 
    <div class="x-dlg-tab" title="基本信息" style="height: 85%"> 
	    -- business html
    </div>
    <div class="x-dlg-tab" title="扩展信息" style="height: 85%">
        -- business html
    </div>
  </div>
</div>

javascript之htjs.dialog组件:

/**
 * htjs之ext扩展dialog
 */
htjs.dialog = {
	dialogs:{},config:{},
	show:function(__elem){
		var _c = this.config;
		var _dom = Ext.get(__elem);
		var _dialog = this.dialogs[_c.divid];
		if (_dialog==null){
			_dialog = new Ext.BasicDialog(_c.divid,_c.dialogconfig);
			for(var k in _c.buttons){
				var hnxfunc=(function(tempfunc){
							 	return function(){ 
							 		var conn = _dialog.getConfig();
									if(conn.param){
							 			tempfunc.call(this,_dialog,conn.param);
									}else{
										tempfunc.call(this,_dialog);
									}
							 	};
						  	 })(_c.buttons[k]);
				_dialog.addButton(k, hnxfunc, _dialog);  
			}
			_dialog.addKeyListener(27, _dialog.hide, _dialog);
			_dialog.addButton('关闭', _dialog.hide, _dialog);
			this.dialogs[_c.divid] = _dialog;
		}
		_dialog.getConfig = function(){
			return _c;
		}
		if(_c.dialogShowBeforeFunc) _c.dialogShowBeforeFunc(_dialog);//弹出框显示前调用
		_dialog.show(_dom);//弹出框显示
		if(_c.dialogShowAfterFunc) _c.dialogShowAfterFunc(_dialog);//弹出框显示后调用
	}
}

//组件使用示例
Htjs.dialog.config={
	divid:“updateDialog", 	//内容部分DIV的ID
	dialogconfig:{autoTabs:true,shadow:true,//EXT弹出框原始参数
		width:750,height:455,
		minWidth:400,minHeigth:350,
		proxyDrag:true,modal:true
	},
	dialogShowBeforeFunc:function(dialog){//加载前调用
		--do something
	}, 
	dialogShowAfterFunc:function(dialog){ //加载后调用
		--do something
	},
	//按钮动作-修改、添加按钮的事件定义
	buttons:{
	      “修改”:function(dialog){
			--do something
		},
	      “审核通过":function(dialog){
			--do something
		}
	}
}
Htjs.dialog.show(elem);