利用extJs的ajax功能及结合js解析xml串无刷新显示数据

利用struts2做服务器端 extJs的ajax无刷新调用struts2刷新数据 还用到js解析服务器端返回的xml串 具体代码如下

struts2代码：

List payList = this.payMgrService.findAllPay(sortId);
HttpServletResponse response = ServletActionContext.getResponse();
response.setContentType("text/xml");
response.setCharacterEncoding("UTF-8");
response.setHeader("Cache-Control", "no-cache");
PrintWriter outPrintWriter = null;
try {
outPrintWriter = response.getWriter();
} catch (IOException e) {
e.printStackTrace();
}
String value = "fail";
if(!payList.isEmpty()){
value = "<?xml version=\"1.0\" encoding=\"UTF-8\"?><pay><size>" + payList.size() + "</size>";
Map map = new HashMap();
for(int i=0;i<payList.size();i++){
map = (Map)payList.get(i);
value = value
+"<bussid>" + map.get("BUSS_ID") + "</bussid>"
+"<name>" + map.get("NAME") + "</name>"
+"<image>" + map.get("IMAGE") + "</image>"
+"<url>" + map.get("URL") + "</url>"
+"<state>" + map.get("STATE") + "</state>" ;
}
value = value + "</pay>";
}
outPrintWriter.write(value);
outPrintWriter.flush();
outPrintWriter.close();

extJs及js代码：


function clearTable(){
var tab = document.getElementById("contentTable");
for(var i=0;i<tab.rows.length;i++){
for(var j=0;j<tab.rows[i].cells.length;j++){
tab.rows[i].cells[j].innerHTML = "";
}
}
}

function showContent(sortId){
clearTable();
Ext.Ajax.request({
url : '../../notice/findAllPay.action',
success : function(msg) {
var res = msg.responseText;
if (res == "fail") {
clearTable();
} else {
var xmlDoc=null;
//判断浏览器的类型
//支持IE浏览器
if(!window.DOMParser && window.ActiveXObject){ //window.DOMParser 判断是否是非ie浏览器
var xmlDomVersions = ['MSXML.2.DOMDocument.6.0','MSXML.2.DOMDocument.3.0','Microsoft.XMLDOM'];
for(var i=0;i<xmlDomVersions.length;i++){
try{
xmlDoc = new ActiveXObject(xmlDomVersions[i]);
xmlDoc.async = false;
xmlDoc.loadXML(res); //loadXML方法载入xml字符串
break;
}catch(e){
}
}
}
//支持Mozilla浏览器
else if(window.DOMParser && document.implementation && document.implementation.createDocument){
try{
/* DOMParser 对象解析 XML 文本并返回一个 XML Document 对象。
* 要使用 DOMParser，使用不带参数的构造函数来实例化它，然后调用其 parseFromString() 方法
* parseFromString(text, contentType) 参数text:要解析的 XML 标记 参数contentType文本的内容类型
* 可能是 "text/xml" 、"application/xml" 或 "application/xhtml+xml" 中的一个。注意，不支持 "text/html"。
*/
domParser = new DOMParser();
xmlDoc = domParser.parseFromString(res, 'text/xml');
}catch(e){
}
}

try
{
var size = xmlDoc.getElementsByTagName("size")[0].childNodes[0].nodeValue;
for(var i=0;i<size;i++){
var name = xmlDoc.getElementsByTagName("name")[i].childNodes[0].nodeValue;
var image = xmlDoc.getElementsByTagName("image")[i].childNodes[0].nodeValue;
var url = xmlDoc.getElementsByTagName("url")[i].childNodes[0].nodeValue;
var state = xmlDoc.getElementsByTagName("state")[i].childNodes[0].nodeValue;
var content = "<a href='" + url + "' target=_blank οnmοuseοver='changeBgColor("+i+")' οnmοuseοut='resetBgColor("+i+")'><img src='images/"+ image + "' border='0'/><br><div style='margin-top:5px' id='div"+i+"'>" + name + "</div></a>";

document.getElementById("content" + i).innerHTML = content;
}
}catch(e){alert(e.message)}
}
},
params : {
sortId : sortId
},
disableCaching: true
});
}