近日在工作当中，碰到一个问题。具体如下：
功能需求：
在一个页面上有一个表单，这个表单里有一两个下拉框，和一个文本输入框
在下面有一个表格用来显示数据。想实现的功能是，当用户在上面进行了选择与输入后，可通过点击查询按钮，去查询与用户所选择和输入的内容相关的数据，结果在下面的表格当中显示出来。
碰到的问题：
由于要给用户比较好的体验，所以打算使用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);
}
分享到：
相关推荐
使用Ajax实现页面无刷新（局部刷新），以登录为例，诠释了ajax的强大和适用。方法简单易懂。
ajax学生成绩查询
在进行Ajax调用过程中一般都具有这样的做法：显示一个GIF图片动画表明后台正在工作，同时阻止用户操作本页面（比如Ajax请求通过某个按钮触发，用户不能频繁点击该按钮产生多个并发Ajax请求）；调用完成后，图片消失...
页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制页面显示JS，AJAX控制...
ajax 获取单独页面 xmlhttp innerHTML ajaxtab 非常实用，简单易懂的ajax教程
使用AJAX进行WhoIs查询
关于Ajax的Timer组件的应用，不刷新页面，时间显示走动，省去了繁琐了JS代码，实现不刷新页面时间的变化。格式为（2011年08月16日 星期二 13:42:20 PM），附带效果图。
ajax实现动态从数据库模糊查询显示到下拉框中(ajax方法返回Dataset的例子）
适合前端初学者 jquery中的datatable使用ajax读取数据 并展示表格数据
自己在struts2中的写好了业务逻辑用response返回的内容却是... 您可能感兴趣的文章:ajax的responseText乱码的问题的解决方法jquery ajax学习笔记2 使用XMLHttpRequest对象的responseXMLAjax request response 乱码解决
Spring Boot和ajax实现信息查询页面,项目使用idea搭建。适合学习spring boot，前后端数据连接的朋友使用。
ajax 注册页面代码！
1．在实验四基础上使用AJAX技术实现异步登录功能。（40分） Ajax异步的特点为：多个事件并行发生，事件互不影响,请求之后，不刷新整张页面，页面不动，只是刷新页面的局部。异步数据获取技术 XMLHttpRequest对象方法...
Ajax加载外部页面的一个弹出层效果 ajax实现弹出层 简单实用
使用AJAX技术来实现读取本地文本文档内容，然后将读取到的内容显示在网页上
Ajax实现分页查询
ajax控制table内容显示方式，点击单元格编辑里面内容。
ajax方式载入外部页面数据的层打开效果