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

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

功能需求：

       在一个页面上有一个表单，这个表单里有一两个下拉框，和一个文本输入框

在下面有一个表格用来显示数据。想实现的功能是，当用户在上面进行了选择与输入后，可通过点击查询按钮，去查询与用户所选择和输入的内容相关的数据，结果在下面的表格当中显示出来。

碰到的问题：

       由于要给用户比较好的体验，所以打算使用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];

						//如果字段为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);
	 
}

 

 

分享到：

利用Spring MVC 上传图片文件 | 使用javascript获取下拉列表框当中的文本值 ...

• 2008-10-31 09:08
• 浏览 3016
• 评论(6)
• 查看更多

评论

6 楼 czwlucky 2008-11-06  

DWR返回的就是json对象，列表的展现上我有一个脚本可供兄弟参考，目前例子没写全，但功能是已经有了，兄弟可以试试，我也会加快例子和编写。http://czwlucky.814e.com

5 楼 amcucn 2008-10-31  

danielli007 写道

建议你在服务端把数据组装成JSON格式返回,这样很方便解析.

那我想问一下JSON格式是什么？返回的是些什么样的数据？我在JS当中如何读取出来？
另外我想问一下DWR可以返回JSON格式吗？ 谢谢！

4 楼 amcucn 2008-10-31  

把数据组装成JSON格式返回,这样很方便

kimmking 写道

js中一样可以使用 A.city.street.road.building.floor 这样的方式

这样的方式可以吗？在JS当中好像无法直接读取到A对象下的其它对象吧？
可有参考代码？

3 楼 kimmking 2008-10-31  

”AJAX使用DWR框架“


出来的当然是json对象

2 楼 danielli007 2008-10-31  

建议你在服务端把数据组装成JSON格式返回,这样很方便解析.

1 楼 kimmking 2008-10-31  

js中一样可以使用
A.city.street.road.building.floor
这样的方式

其实你都意识到了另一种方式
for(var dto  in dtoList){ 

  dto["productInfo"]["code"]["type"]["name"]

}  


你可以看看js内联数组