当前位置: 代码迷 >> Web前端 >> Ext.grid.GridPanel loadMask 没效果 失效 解决方法
  详细解决方案

Ext.grid.GridPanel loadMask 没效果 失效 解决方法

热度:771   发布时间:2012-10-11 10:16:10.0
Ext.grid.GridPanel loadMask 没效果 失效 解决办法
Ext.onReady(function(){
          var proxy=new Ext.data.HttpProxy({url:'JsonServlet?          action=moneyList'});
          var record=new Ext.data.Record.create([{name:'id',type:'string',mapping:'id'},
				{name:'userName',type:'auto',mapping:'userName'},
				{name:'idCard',type:'auto',mapping:'idCard'},
				{name:'docId',tpye:'auto',mapping:'docId'},
				{name:'date',type:'auto',mapping:'date'},
				{name:'ymoney',type:'auto',mapping:'ymoney'},
				{name:'smoney',type:'auto',mapping:'smoney'}
			]);
	var reader=new Ext.data.JsonReader({totalProperty:'count',root:'root'},record);
	var store=new Ext.data.Store({
				proxy:proxy,
				reader:reader
			});
                store.load({params:{start:0,limit:300}});
			
			//表格列
	var cm=new Ext.grid.ColumnModel([
								{header:'薪酬发放单号',dataIndex:'id'},
								{header:'姓名',dataIndex:'userName'},
								{header:'身份证号',dataIndex:'idCard'},
								{header:'档案编号',dataIndex:'docId'},
								{header:'登记时间',dataIndex:'date'},
								{header:'应发金额',dataIndex:'ymoney'},
								{header:'实发金额',dataIndex:'smoney'}]);
			//表格
			var grid=new Ext.grid.GridPanel({
				store:store,
				cm:cm,
				autoHeight:true,
				bodyStyle:"width:100%",
				autoWidth:true,
				renderTo:'div1',
				
				frame:true,
				/*
				 *默认情况下,grid可以拖放列,也可以改变列的宽度,如果要禁用这两个功能,可以在定义Grid对象时分别设置enableColumnMove和enableColumnResize为false即可
				 */
				enableColumnMove:false,
				enableColumnResize:false,
				//grid还支持一种读取数据时的遮罩和提示功能,设置属性loadMask:true,在store.load()完成之前会一直显示"Loading。。。。。。。。。"
				loadMask:true
				
			});
			
			
		});

?如上代码:loadMask:true没有任何效果

解决办法:store.load()这句话需要放在var grid=new Ext.grid.GridPanel({})之后

修改后的代码:

		Ext.onReady(function(){
			var proxy=new Ext.data.HttpProxy({url:'JsonServlet?action=moneyList'});
			var record=new Ext.data.Record.create([{name:'id',type:'string',mapping:'id'},
				{name:'userName',type:'auto',mapping:'userName'},
				{name:'idCard',type:'auto',mapping:'idCard'},
				{name:'docId',tpye:'auto',mapping:'docId'},
				{name:'date',type:'auto',mapping:'date'},
				{name:'ymoney',type:'auto',mapping:'ymoney'},
				{name:'smoney',type:'auto',mapping:'smoney'}
			]);
			var reader=new Ext.data.JsonReader({totalProperty:'count',root:'root'},record);
			var store=new Ext.data.Store({
				proxy:proxy,
				reader:reader
			});
			
			//表格列
			var cm=new Ext.grid.ColumnModel([
								{header:'薪酬发放单号',dataIndex:'id'},
								{header:'姓名',dataIndex:'userName'},
								{header:'身份证号',dataIndex:'idCard'},
								{header:'档案编号',dataIndex:'docId'},
								{header:'登记时间',dataIndex:'date'},
								{header:'应发金额',dataIndex:'ymoney'},
								{header:'实发金额',dataIndex:'smoney'}]);
			//表格
			var grid=new Ext.grid.GridPanel({
				store:store,
				cm:cm,
				autoHeight:true,
				bodyStyle:"width:100%",
				autoWidth:true,
				renderTo:'div1',
				
				frame:true,
				/*
				 *默认情况下,grid可以拖放列,也可以改变列的宽度,如果要禁用这两个功能,可以在定义Grid对象时分别设置enableColumnMove和enableColumnResize为false即可
				 */
				enableColumnMove:false,
				enableColumnResize:false,
				//grid还支持一种读取数据时的遮罩和提示功能,设置属性loadMask:true,在store.load()完成之前会一直显示"Loading。。。。。。。。。"
				loadMask:true
				
			});
			store.load({params:{start:0,limit:300}});
			
		});

?

  相关解决方案