EXT 可以这么使用

最新推荐文章于 2024-01-10 13:49:17 发布

原创最新推荐文章于 2024-01-10 13:49:17 发布 · 132 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#EXT #prototype #Ajax #UI

首先申明一下，本人不是专门搞ExtJS的

每个页面都可以使用俩个自定义的JS作为使用ExtJS补充

ui-style.js,主要是覆盖ExtJS默认的属性，如日期格式默认是mm/yy/dd,可以改成yy-mm-dd,如下内容供参考


Ext.form.Field.prototype.msgTarget = 'under';
Ext.form.FormPanel.prototype.labelWidth= 80;  
Ext.form.FormPanel.prototype.labelAlign='left';
Ext.form.BasicForm.prototype.waitTitle = '处理中';
Ext.grid.DateColumn.prototype.format   = "Y-m-d";
Ext.form.DateField.prototype.format = "Y-m-d";
//page
PAGE_LIMIT  = 10
Ext.PagingToolbar.prototype.displayInfo=true;
Ext.PagingToolbar.prototype.displayMsg='从{0} 到 {1} 总共 {2} ';
Ext.PagingToolbar.prototype.emptyMsg = "无记录";
Ext.PagingToolbar.prototype.pageSize=PAGE_LIMIT;
//grid
Ext.grid.GridPanel.prototype.stripeRows=true;
Ext.BLANK_IMAGE_URL = window.contextPath +'/resource/extjs/skins/default/images/default/s.gif';
//combox
Ext.form.ComboBox.prototype.mode = "local";
Ext.form.ComboBox.prototype.triggerAction = "all";
Ext.form.ComboBox.prototype.valueField = "id";
Ext.form.ComboBox.prototype.displayField = "displayText";//
Ext.form.TextField.prototype.width = 140;
Ext.form.ComboBox.prototype.width = 140;
//其他变量
MUST_SELECT_ONE = "请选中一行";
SERVER_ERROR = "服务器错误，请稍后再试"
OPERATION_SUCCESS="操作成功"

另外一个是修改ExtJS默认处理，如ajax load出错，则给出统一提示，再比如当ajax请求，锁定页面上的某个button或者窗口等，例子如下：


Ext.data.Store.prototype.listeners = {
            exception:function(dataProxy, type, action, options, response, arg) {
            		alert(SERVER_ERROR);

            }
}

Ext.Ajax.on('beforerequest', beforerequest, this);
Ext.Ajax.on('requestcomplete', requestcomplete, this);
Ext.Ajax.on('requestexception', requestexception, this);

function beforerequest(conn,  options){
	var cmp = Ext.getCmp(options.maskId);

		if(cmp!=null){
		var xtype = cmp.getXType()
		if(xtype=="grid"||xtype=="form"||xtype=="panel"){
			cmp.el.mask('请稍等....', 'x-mask-loading');  
		}else{

			cmp.disable();
		}

	}

}

function requestcomplete( conn,  response,  options){
	var cmp = Ext.getCmp(options.maskId);	
	if(cmp!=null){
		var xtype = cmp.getXType()
		if(xtype=="grid"||xtype=="form"||xtype=="panel"){
			cmp.el.unmask('请稍等....', 'x-mask-loading');  
		}else{
			cmp.enable();
		}
	}

}

function requestexception( conn,  response,  options){
	requestcomplete(conn,response,options);

}