Ext中GridPanel,分页通用实现方式


/*------------------后台交互,支持分页排序----------------------------*/
function getGrid(title,urlpath,header,fileds)
{
		var columns =getColModel(header,fileds);
		var filed = getFiled(fileds);
	
		var cm = new Ext.grid.ColumnModel(columns);
		
		var store = new  Ext.data.JsonStore({
				proxy: new Ext.data.HttpProxy({url:urlpath}),
				totalProperty: 'totalProperty',
				remoteSort:true,
				root: 'root',
				fields :filed
		});
		
		var pagetool = pagingTool(store);
		
		var grid = new Ext.grid.GridPanel({
				 height: 300,	
				 autoWidth:true,
				 store: store,
				 cm: cm,
				 loadMask:{msg:'数据加载中,请稍等...'},
		 		 title:title,
		 		 bbar:pagetool
		});
		
		 store.load({params:{start:0,limit:5}});
		 
		 return grid;
}

// 返回表头
function getColModel(header , filed)
{
	var fields = filed.split(",");
	var headers = header.split(",");
	//获得列对对象
	var col = "[";
	for(var i = 0; i<headers.length;i++)
	{
		var h = headers[i];
		var fun = "";
		
		if (headers[i].indexOf("|") > 0)
		{
			var hs = headers[i].split("|");
			h = hs[0];
			fun = hs[1];
			col = col+"{header:'"+h+"',align:'center',sortable: true,dataIndex:'"+fields[i]+"',renderer:"+fun+",height:30},";
		}
		else
		{
			col = col+"{header:'"+h+"',align:'center',sortable: true,dataIndex:'"+fields[i]+"',height:30},";
		}
	}
	
	if(col != "[")
	{
		col = col.substring(0,col.length-1);
	}
	col = col+"]";
	return strToJson(col);
}

function getFiled(filed)
{
	var fields = filed.split(",");
	var filed ="[";
	for(var i=0;i<fields.length;i++)
	{
		filed = filed + "{name: '"+fields[i]+"'},";
	}
   filed = filed.substring(0,filed.length-1);
   filed = filed +"]";
   return strToJson(filed);
}

// 返回分页工具条
function pagingTool(store)
{
	var pagetool = new Ext.PagingToolbar (	{
				pageSize : 5,
				store:store,
				displayInfo:true,
				displayMsg : '显示第{0}条到{1}条记录 ,一共{2}条',
				emptyMsg: "没有记录"
    });
	return pagetool;
}
/**
 * eval关于作用域浏览器见不一致
 * ***/
function strToJson(str){   
	    var json = (new Function("return " + str))();   
	    return json;   
} 

你可能感兴趣的:(gridPanel)