如何使用AJAX方式将查询出的结果在当前页面上显示出来?寻问高手！

[yk789]

近日在工作当中，碰到一个问题。具体如下：

功能需求：

在一个页面上有一个表单，这个表单里有一两个下拉框，和一个文本输入框在下面有一个表格用来显示数据。想实现的功能是，当用户在上面进行了选择与输入后，可通过点击查询按钮，去查询与用户所选择和输入的内容相关的数据，结果在下面的表格当中显示出来。
碰到的问题：
由于要给用户比较好的体验，所以打算使用AJAX方式将查询到的内容直接在当前页面的表格上显示出来，而不是刷新整个页面。AJAX使用DWR框架，现在我已经做到将数据从后台查询出来了。但是在将数据写入到当前表格时碰到问题，不知道如何去写。
相关情况：
后台的数据返回的一个对象集合，每个对象又包含多个其它对象的引用如：

  Class A {   
  
       String name;   
  
       City city;    //City是一个单独的类，它也有自己的一些字段   
  
     Brand brand; //Brand 同理也有是一个单独的类，也有自己的一些字段  
}

现在后台返回的是一个List 这个List当中是一个一个的A对象。现在我想在前台页面上将DWR返回的这个集合把对象A一个一个读取出来，而且要将对象A当中的包含的city,brand

对象的字段也读取出来，即想像java里那样通过这样A.city.name A.brand.name 将我需要的字段读取出来。

现在的问题是：

我如何去读取？？然后如何将读取到的内容写到表格里？由于我的表格具有很多的样式，我不可能将所有的HTML代码都使用javascript来组合吧？
我自己也写了一些方法可以取出集合里的对象里的属性，但是我感觉效率不高，而且极其麻烦。

代码如下：

//查询返回处理函数
function productCallBack(productList) {
	    var code;
	    var model;
	    var brand;
	    var city;
	    var province;
	    var type;
	    var color;
	    
	    //循环集合，得到box
		for(var property in productList){  
		//循环box,判断字段
			for(var pro in productList[property]){ 
			//如果字段为productInfo则进一步循环productInfo
				if(pro == "productInfo"){
					for(var pro3 in productList[property][pro]) {
						if(pro3 == "code") {
							code = productList[property][pro][pro3];
						}else if(pro3 =="type") {
							for(var pro4 in productList[property][pro][pro3]) {
								if(pro4 == "name") {
									type = productList[property][pro][pro3][pro4];
								}
							}
						}else if(pro3 == "model") {
							model = productList[property][pro][pro3];Js代码 
                    //如果字段为brand，则再一步循环brand,已便得出brand下的所有字段   
                    }else if(pro3 == "brand") {   
                        for(var pro4 in productList[property][pro][pro3]) {   
                                if(pro4 == "name") {   
                                    brand = productList[property][pro][pro3][pro4];   
                                }   
                        }   
                    }else if(pro3 == "color") {   
                        for(var pro4 in productList[property][pro][pro3]) {   
                                if(pro4 == "name") {   
                                    color = productList[property][pro][pro3][pro4];   
                                }   
                        }   
                    }   
                }   
            }   
    }     
}   
alert(code);   
alert(type);   
alert(model);   
alert(brand);   
alert(color);   
    
}

[jastby]

实际 你在后台 返回处理好的表格 就行了,然后 把表格显示到页面上

[yk789]

<param name="include" value="fenleiname"> </param》

我不明白这是什么意思？
那如果我的属性是其它的一个类呢？而我需要这个类下面的一些属性，或者是更下面的一些属性，我如何配置？

不过你的思路确实是我所需要的！


另外我还想问一下，我如何将结果在页面上显示出来？
我要显示出来的是一行一行的数据，当然这一行是有很多的内容也包括很多的样式、按钮啊什么的！

难道我要将这些内容的HTML代码也在JS当中写出来？？这工作量也太大了吧！
不知道有没有其它更好的方式！
谢谢！

[lihan6415151528]

看来这里说不方便了，楼主加我QQ吧
397764284！

[yk789]

其实，我也想过这种办法，但是我觉得这种方式耦合性太高，想想，要在后台的java代码当中嵌入大量的HTML代码，这种方式还是不太好吧！

[lihan6415151528]

楼主html代码写到页面也是写，写到js也是写

有何不同

类似这样

function getFenleiByXilieId(date){
	
	var html="<span class='select1'><select style='width:105' name='fenlei'>";
	var html3="</select></span>"
	var html2="<option value=\"\">所有分类</option>";
	for(var i=0;i<date.length;i++)
	{
	 if('${param.fenlei}'==date[i].id)
     {
		html2+="<option value="+date[i].id+" selected>"+date[i].fenleiname+"</option>";
	 }
	 else{
	   html2+="<option value="+date[i].id+">"+date[i].fenleiname+"</option>";
	 }
	}
	document.getElementById("fenlei").innerHTML=html+html2+html3;
	
}

[寻梦928]

不会，帮你顶！