EXTJS AJAX 解析 XML 数据

最新推荐文章于 2013-10-29 13:14:00 发布

原创最新推荐文章于 2013-10-29 13:14:00 发布 · 3.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#extjs #ajax #xml #null #exception #function

web 编程同时被 3 个专栏收录

54 篇文章

订阅专栏

JAVA

23 篇文章

订阅专栏

JavaScript

22 篇文章

订阅专栏

本文介绍如何使用ExtJS框架的AJAX功能从后端获取XML格式的数据，并将其展示在前端页面上。具体实现了通过POST请求获取所有区域信息，解析XML数据并显示每个区域的ID、名称及总装机容量。

EXTJS AJAX 从后台取 XML 数据在页面上展示

页面JS

function getAllAreaInfos()
	{
		var areaName = "";
		Ext.Ajax.request({
		   	method: 'POST',
		   	url: 'allAreaInfos',
		   	params: {"areaName":areaName},
		   	waitMsg: '数据更新中，请稍后...',
		   	success: function(response,options){
		   		var xmlDoc = response.responseXML;
		   		if(xmlDoc!=null)
	   			{
		   			var ais = xmlDoc.getElementsByTagName("Areainfo"); 
		   			if(ais!=null&&ais.length>0) 
	   				{
	   					for(var i=0;i<ais.length;i++)//   DB  
		                {  
		                    var asId = (ais[i].getElementsByTagName("id")[0].childNodes[0].nodeValue);    //  第i个areaInfos的id  
		                    var asName = (ais[i].getElementsByTagName("name")[0].childNodes[0].nodeValue);    //  第i个areaInfos的名字  
		                    var allCapacity = (ais[i].getElementsByTagName("allCapacity")[0].childNodes[0].nodeValue);    //  第i个areaInfos的总装机容量
		                    //document.getElementById(asName).innerHTML="";
		                    document.getElementById(asName).innerHTML=allCapacity;//得到的数据在页面上展示
		                }  
	   				}
	   			}
		   	},
		   	failure: function(response,options){
		   		Ext.Msg.alert("信息提示", "获取数据库数据出错,请稍后再试！");
		   	},
		   	autoAbort:false
		});
	}

action

public String getAllAreaInfos() {
		try {
			List<Areainfo> list = null;
			if(areaName!=null&&!areaName.equalsIgnoreCase("null")&&areaName.trim().length()>0)
			{
				list = mapInfos.findAllAreaInfos(this.subStringAreaName(areaName));
			}
			else
				list = mapInfos.findAllAreaInfos(null);
				
			response.setContentType("text/xml;charset=utf-8");
			response.setCharacterEncoding("utf-8");
			PrintWriter pw = null;
			pw = response.getWriter();
			StringBuffer sb = new StringBuffer();
			sb.append("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
			
			sb.append("<Items>");
			if(list==null)
			{
				sb.append("<Areainfo>");
				sb.append("<id>").append("no").append("</id>");
				sb.append("</Areainfo>");
			}
			else
			{
				for (int i = 0; i < list.size(); i++) 
				{
					Areainfo v = list.get(i);
					sb.append("<Areainfo>");
					
					sb.append("<id>").append(v.getId()).append("</id>");
					sb.append("<name>").append(v.getName()).append("</name>");
					sb.append("<allCapacity>").append(v.getAllcapacity()).append("</allCapacity>");
					
					sb.append("</Areainfo>");
				}
			}
			sb.append("</Items>");
			
			String xmlDBTree = sb.toString();
			
			pw.print(xmlDBTree);
			pw.flush();
			pw.close();
		} catch (Exception e) {
			e.printStackTrace();
		}
		return null;
	}