Ext.grid.GridPanel 后台得数 页面展示

注意要使用EXTJS 就必须在页面把相应的包引入到页面

<link rel="stylesheet" type="text/css" href="../ext/resources/css/ext-all.css"/>
<script type="text/javascript" src="../ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext/ext-all.js"></script>

js

 Ext.onReady(function() {
	  	name = encodeURI(name);	//	页面转码，以防乱码 后台要解码
	  	var obj = document.getElementById("div1");
	  	if(obj!=null)
	  	{
			var divInnerHTML = obj.innerHTML;
			if(divInnerHTML!=null&&divInnerHTML.trim().length>0)
			{	
				document.getElementById("div1").innerHTML = "";
			};
	  	};
	  	
		var store=new Ext.data.Store({
				//method: 'POST',
				url:"mapInfos?areaName="+name+"",//	请求的URL路径,和自己要传递的参数
				reader:new Ext.data.XmlReader({
				record:"Item"},//注意 此Item就是数据的行
				["ziDuan0","ziDuan1","ziDuan2","ziDuan3"])
		});
		
		//	每列所对应的名字
		var colM=new Ext.grid.ColumnModel([
							{header:"字段0",dataIndex:"ziDuan0"},
							{header:"字段1",dataIndex:"ziDuan1",width: 80},
							{header:"字段2",dataIndex:"ziDuan2",width: 50},
							{header:"字段3",dataIndex:"ziDuan3",sortable:true,width: 50}]);
		
		var grid = new Ext.grid.GridPanel({
					renderTo:"div1",	//	在哪个层里展示
					title:"这里是要写的标题",	//	标题
					height:200,
					width:580,
					cm:colM,//	要加载的列头
					store:store,	//	要加载的数据
					autoExpandColumn:2
		});
		store.load();//	注意一定不要忘记写，否则是不加载数据的
	});

页面

<div id="div1"></div>

struts2   action 

public String execute() throws Exception {
		
		List<MapLeftInfosView> list = null;
		try {
			if(areaName!=null&&!areaName.equalsIgnoreCase("null")&&areaName.trim().length()>0)
			{
				String name = new String((areaName.getBytes("ISO-8859-1")),"UTF-8"); //对得到的参数进行转码

				MapLeftInfosView v = new MapLeftInfosView();
				v.setWfName(this.subStringAreaName(name));
				list = mapInfos.findMapLeftInfosViews(v);
			}
			else
				list = mapInfos.findMapLeftInfosViews(null);
				
		} catch (Exception e) {
			msg = "得到数据时失败！";
			e.printStackTrace();
			return "sorry";
		}
		
		if(list!=null)
		{
			System.out.println(list.size());
			response.setContentType("text/xml;charset=utf-8");
			response.setCharacterEncoding("utf-8");
			PrintWriter pw = null;
			try {
				pw = response.getWriter();
			} catch (IOException e) {
				e.printStackTrace();
			}
			StringBuffer sb = new StringBuffer();
			sb.append("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
			
			sb.append("<Items>");
			
			for (int i = 0; i < list.size(); i++) 
			{
				MapLeftInfosView v = list.get(i);
				sb.append("<Item>");//	注意此处的Item 和JS中的record 属性是一致的
				
				sb.append("<ziDuan0>").append(v.getWfId()).append("</ziDuan0>");
				sb.append("<ziDuan1>").append(v.getWfName()).append("</ziDuan1>");
				sb.append("<ziDuan2>").append(v.getAllCapacity()).append("</ziDuan2>");
				sb.append("<ziDuan3>").append(v.getWfp()).append("</ziDuan3>");
				
				
				sb.append("</Item>");
			}
			
			sb.append("</Items>");
			
			String xmlDBTree = sb.toString();
			
			pw.print(xmlDBTree);
			pw.flush();
			pw.close();
		}
		return null;
	}