EXTJS总结3

ExtJs所有的表单组件图

 

1、防止用户在提交时进行其他操作

点击提交按钮，弹出对话框，覆盖面板，等待后台反馈信息时再取消覆盖效果

            function progress(){

                el = grid.getEl();     

                el.mask("数据正在提交中……");   

a)             };

b)        提交按钮处调用此函数；

c)         反馈信息处调用此行代码即可:el.unmask();  

 

2、在已有的数据上进行数据的追加

 

3、在GRID上对数据行进行操作，不使用右键菜单，即添加一列，列中的数据已定死，点击则可触发对应的函数，该函数可对该行数据进行操作

var sm = new Ext.grid.CheckboxSelectionModel();
	Ext.QuickTips.init();
	var MyRecord = Ext.data.Record.create([
			{
				name : 'id',
				type : 'int'
			},{
				name : 'grpName',
				type : 'String'
			}, {
				name : 'ruleName',
				type : 'string'
			}]);
	var cm = new Ext.grid.ColumnModel([sm, 
				{
				header : "",
				width : 120,
				dataIndex : 'grpName',
				sortable : true
			}, {
				header : "number",
				width : 120,
				dataIndex : 'ruleName',
				sortable : true,
				renderer:function(value,rowIndex){
					var arrs = value.split(',');
					var count = arrs.length - 1;
					return count;
				}
			},{header: "操作",  align:"center",width:120,dataIndex:'id', menuDisabled:true,sortable : false, //标题菜单是否可用
				 renderer: function(value,rowIndex){
					return  '<span  style="margin-right:10px"><input type="button" id="'+ value + '" value=""/></span>';
				}
			   }
	]);
	
	store = new Ext.data.GroupingStore({
				proxy : new Ext.data.HttpProxy({
							method : 'post',
							url : 'listRuleGrp.action'
						}),
				groupField : 'grpName',
				reader : new Ext.data.JsonReader({
							id : 'id',
							totalProperty : 'total',
							root : 'rows'
						}, MyRecord)
			});

store.load({
		params : {
			start : 0,
			limit : 20
		},callback : function(records, options, success) {   
			for(var i = 0 ; i < records.length; i++){
            	 Ext.get(document.getElementById(records[i].get('id'))).on("click",function(e,t){
            		// alert(t.id);
            		showWin(t.id); 
		    	});
		    }
        }
	});

  4、EXTJS中的消息框信息