问答首页 → Web前端技术
0 0

AJAX问题，使用DWR作为框架，困扰了小组好几天了10

biz层会返回一个List
然后在function里面获取这个List
遍历他，因为list里面存储的是object数组
想让数据显示在网页里
怎么遍历?
问题补充：
我会遍历
就是不明白怎么把数据遍历到表格里.....
问题补充：
表格的位置是固定的
所有不能构建字符串....
function call_res(data){
   for(var i=data.length;;i--){
       //问题在这里,表格不能构建,只能通过表格的ID来操作.
       //data是个List,里面的元素都是数组形式的.
       求这段代码...!!!
   }
}





<table id="table">
<tr id="tr">
<td id="td"></td>
</tr>
</table>
DWR 
2009年3月15日 01:04

11个答案 按时间排序 按投票排序

0 0

看我的一个例子吧
dwr中javascript方法调用后台的java方法并且填充前台页面 

function fillSchedulingTable(startTime,endTime) {
				if(startTime == "" || startTime.length <= 0 || endTime == "" || endTime.length <= 0){
					var sValue = $('startTime').value;
					var eValue = $('endTime').value;
					if(sValue == "" || sValue.length <= 0){
						$('startTime').focus();
					}else if(eValue == "" || eValue.length <= 0){
						$('endTime').focus();
					}
					return;
				}
				startTimeCache = startTime;
				endTimeCache = endTime;
			  	SchedulingTableService.findSchedulingTableByCompanyId($('companyid').value,null,null,startTime,endTime,function(SchedulingTableList) {
				    dwr.util.removeAllRows("schedulingTablebody", {filter:function(tr) {
			      		return (tr.id != "pattern");
			    	}
			    });
			    var schedulingTable, id;
			   	if(SchedulingTableList != null){
			   		dwr.util.useLoadingMessage("加载排班表...");
			   		if(SchedulingTableList.length > 0){
					    for (var i = 0; i < SchedulingTableList.length; i++) {
					      schedulingTable = SchedulingTableList[i];
					      id = schedulingTable.id;
					      dwr.util.cloneNode("pattern", { idSuffix:id });
					      dwr.util.setValue("tableStrWorkDate" + id, schedulingTable.strWorkDate);
					      dwr.util.setValue("tableCompanyid" + id, schedulingTable.companyid);
					      dwr.util.setValue("tableDeptName" + id, schedulingTable.companyName + "-" + schedulingTable.deptName);
					      dwr.util.setValue("tableMainWork" + id, schedulingTable.mainWork);
					      dwr.util.setValue("tableDeputyWork" + id, schedulingTable.deputyWork);
					      dwr.util.setValue("tableWorkArea" + id, schedulingTable.workArea);
					      dwr.util.setValue("tableScope" + id, schedulingTable.scope);
					      dwr.util.setValue("tableWorkTime" + id, schedulingTable.workTime);
					      dwr.util.setValue("tableWorkVehicleLicensePlate" + id, schedulingTable.workVehicleLicensePlate);
					      dwr.util.setValue("tableRemark" + id, schedulingTable.remark);
					      dwr.util.setValue("tableTabulationPeople" + id, schedulingTable.tabulationPeople);
					      $("pattern" + id).style.display = ""; 
					    }
			    	}
			   	}
			  });
			}



前台页面的代码 
<table border="0" cellspacing=0 class="mytable" WIDTH="90%" cellpadding="0">
				<thead>
					<tr style="height: 10px">
						<th rowspan="2" class="nobg" align="center" valign="bottom">
							<button onclick="show('/car/base.do?method=token&pageflag=scheduling_table_add',window,550,350,1,0,0,0);">
								<div alt="添加" class="add" />
							</button>
						</th>
						<th rowspan="2" align="center" valign="bottom">
							<nobr>
								日期
							</nobr>
						</th>
						<th rowspan="2" align="center" valign="bottom">
							<nobr>
								事业部
							</nobr>
						</th>
						<th colspan="2" align="center" nowrap="nowrap" style="border-bottom-style: none">
							<nobr>
								查勘组
							</nobr>
						</th>
						<th rowspan="2" align="center" valign="bottom">
							<nobr>
								所值区域
							</nobr>
						</th>
						<th rowspan="2" align="center" valign="bottom">
							<nobr>
								范围
							</nobr>
						</th>
						<th rowspan="2" align="center" valign="bottom">
							<nobr>
								当班时间
							</nobr>
						</th>
						<th rowspan="2" align="center" valign="bottom">
							<nobr>
								值班车牌
							</nobr>
						</th>
						<th rowspan="2" align="center" valign="bottom">
							<nobr>
								备注
							</nobr>
						</th>
					</tr>
					<tr>
						<th align="center" valign="bottom">
							<nobr>
								主班
							</nobr>
						</th>
						<th align="center" valign="bottom">
							<nobr>
								副班
							</nobr>
						</th>
					</tr>
				</thead>
				<tbody id="schedulingTablebody">
					<tr id="pattern" style="display:'none';">
						<td class=spec>
							<nobr>
								<button style="width: 24px;height: 23px;" id="delete" onclick="deleteById(this.id.substring(6))">
									<div alt="删除" class="del" />
								</button>
								<button id="edit" onclick="show('/car/base.do?method=token&pageflag=scheduling_table_edit&id=' + this.id.substring(4),window,550,350,1,0,0,0);">
									<div alt="编辑" class="edit" />
								</button>
								<button  onclick="WdatePicker({position:{left:80},isShowClear:false,readOnly:true,el:'copy' + this.id.substring(5),onpicked:function(v){copySchedulingRecord(this.id.substring(4),v.cal.getDateStr())}})" id="imcpy">
									<div  alt="复制到指定日期"  class="copy"/>
								</button>
								<span id="copy" style="display: none"></span>
							</nobr>
						</td>
						<td>
							<nobr>
								<span id="tableStrWorkDate"></span>
							</nobr>
						</td>
						<td>
							<nobr>
								<span id="tableDeptName"></span>
							</nobr>
							<span id="tableCompanyid" style="display: none"></span>
						</td>
						<td>
							<nobr>
								<span id="tableMainWork"></span>
							</nobr>
						</td>
						<td>
							<nobr>
								<span id="tableDeputyWork"></span>
							</nobr>
						</td>
						<td>
							<nobr>
								<span id="tableWorkArea"></span>
							</nobr>
						</td>
						<td>
							<nobr>
								<span id="tableScope"></span>
							</nobr>
						</td>
						<td>
							<nobr>
								<span id="tableWorkTime"></span>
							</nobr>
						</td>
						<td>
							<nobr>
								<span id="tableWorkVehicleLicensePlate"></span>
							</nobr>
						</td>
						<td>
						<span id="tableTabulationPeople" style="display: none"></span>
							<nobr>
								<span id="tableRemark"></span>
							</nobr>
							&nbsp;
						</td>
					</tr>
				</tbody>
			</table>



后台java的方法 
public List findSchedulingTableByCompanyId(Integer companyid, String companyName, String deptName, String startTime,
			String endTime) throws ParseException {
		String format = "yyyy-MM-dd";
		DetachedCriteria dc = DetachedCriteria.forClass(SchedulingTable.class);
		dc.add(Restrictions.eq("companyid", companyid));
		if(startTime != null && !"".equals(startTime) && endTime != null && !"".equals(endTime)){
			dc.add(Restrictions.between("workDate", Utils.getDate(startTime, format), Utils.getDate(endTime, format)));
		}
		if(companyName != null && !"".equals(companyName)){
			dc.add(Restrictions.like("companyName",companyName));
		}
		if(deptName != null && !"".equals(deptName)){
			dc.add(Restrictions.like("deptName",deptName));
		}
		List list = schedulingTableDAO.findByCriteria(dc);
		for (Iterator it = list.iterator(); it.hasNext();) {
			SchedulingTable st = (SchedulingTable) it.next();
			st.setStrWorkDate(Utils.getDate(st.getWorkDate(),"yyyy-MM-dd"));
		}
		return list;
	}


这个是我系统中已经应用的代码.给了你三个关键代码,你研究下就明白了

2009年3月18日 13:06
0 0

用HTML DOM方法:

<table id="table"></table>


var table = document.getElementById("table");

for(var i=0, l=data.length; i<l; i++){
  table.insertRow(i); // 在该表格中插入指定索引的行<tr>
  var row = table.rows[i]; // 获取该行
  var dataI = data[i]
  for(var j=0, l=dataI.length; j<l; j++){
    row.insertCell(i); // 在该行中插入指定索引的单元格<td>
    row.cells[i].innerHTML = dataI[i]; // 将相应的数据插入该单元格
  }
}

2009年3月17日 20:22
0 0


var table = document.getElementById("table");

var trs = table.getElementsByTagName("tr");

for(trs){

var tds = trs[i].getElementsByTagName("td");
for(tds){
    tds[i].innerHTML(xxxxx);
}

}

2009年3月17日 17:30
0 0

你都会遍历了，怎么还会不明白怎么把数据遍历到表格里...呢》
就构建表格，把值传过去嘛

2009年3月17日 17:05
0 0


可以拼凑字符串，然后用innerHTML插入到页面上

var s ='';

s+='<table><tr><td>'
s+=obj.name
s+='</td>'

...

然后，

document.getElementById("dsfasd").innerHTML(s);

2009年3月17日 17:05
0 0

按java方式遍历啊

2009年3月16日 14:22
0 0

for(var i=0,i<list.length, i++){
  var current = list[i];
  //遍历对象中的属性
  for(var prop in current){
    alert(prop+"->"+var[prop]);
  }
}

2009年3月16日 13:50
0 0

你就把它当成java对象一样的遍历，只不过是用js的方式而已，
对象的属性就直接以这种方式:
例如：有一个对象obj，有属性name,pwd
就用obj.name 就可以得到了

2009年3月16日 12:09
0 0

for (var i = 0;i<list.length;i++){  
    alert([list[i].id,list[i].name,list[i].col,list[i].num]);  
}
这种方式是正确的

2009年3月16日 09:51
0 0 

function call_res(list){
	var tab = new Array;
	for (var i = 0;i<list.length;i++){
    	tab.push([list[i].id,list[i].name,list[i].col,list[i].num]);
    }    
    grid3.fillGrid(tab);
}

2009年3月16日 08:37
0 0


不知道你所说的具体的格式是什么？

是否是json？或者是普通的数组？最好有返回的数组的格式。我猜测可能就是json吧

js的读取不难。

2009年3月15日 16:44

相关推荐

    AJAX框架DWR简单应用

    在提供的“AJAX框架DWR简单应用.pdf”文件中，你可能会找到关于如何设置DWR环境、编写Java接口、配置DWR配置文件、在前端JavaScript中使用DWR，以及示例代码和实际运行效果的详细教程。这个文件是学习和理解DWR工作...

    AJAX 与 DWR框架

    总的来说，Ajax和DWR框架的结合使用，可以显著提升Web应用的用户体验，减少不必要的页面刷新，提高数据处理效率。同时，通过DWR与主流Java框架的集成，开发者可以更方便地在大型项目中引入Ajax技术，而不必重构大量...

    DWR AJAX框架（包含使用教程）

    DWR (Direct Web Remoting) 是一个开源的Java框架，它允许Web应用程序在客户端与服务器之间进行实时的、异步的数据交换，极大地提升了用户体验。DWR利用AJAX（Asynchronous JavaScript and XML）技术，实现了浏览器...

    AJAX技术之DWR框架入门

    **AJAX技术之DWR框架入门** AJAX（Asynchronous JavaScript and XML）是一种在无需刷新整个页面的情况下，能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换，使得网页实现异步更新。这种技术可以提升...

    Ajax资料,DWR框架资料

    **DWR（Direct Web Remoting）**是一个开源Java框架，它简化了在Web应用中使用Ajax的过程。DWR允许JavaScript在浏览器端直接调用服务器端的Java方法，而无需传统的HTTP请求。这极大地提高了Web应用的交互性和实时性...

    dwr实现ajax功能ajax+dwr

    **Ajax + DWR**结合使用时，DWR作为一个中间层，处理JavaScript和Java之间的通信。开发者可以定义Java类和方法，DWR会自动生成对应的JavaScript接口，使得在浏览器中可以直接调用这些服务端方法。这样，我们可以在不...

    Ajax + struts 与 ajax 的 dwr 框架的使用

    **Ajax + Struts 与 Ajax 的 DWR 框架使用详解** 在现代Web开发中，Ajax（Asynchronous JavaScript and XML）技术极大地提升了用户体验，它允许网页在不刷新整个页面的情况下与服务器进行交互。Struts作为Java EE...

    java_ajax框架dwr

    **Java AJAX 框架 DWR 全面解析** DWR (Direct Web Remoting) 是一个强大的Java AJAX框架，它允许在浏览器和服务器之间进行直接的JavaScript与Java对象的交互，使得开发者能够轻松构建富客户端应用程序。DWR的出现...

    DWR js框架 javascript框架 web与java交互 Direct Web Remoting Ajax开源框架

    综上所述，DWR作为一个强大的JavaScript框架，极大地简化了Web开发者在Java和JavaScript之间的交互，提供了一种高效、安全的方法来实现Ajax功能。通过理解并熟练使用DWR，开发者可以构建出更加动态和用户友好的Web...

    AJAX_DWR框架

    AJAX (Asynchronous JavaScript and XML) 和 DWR (Direct Web Remoting) 是两种在Web开发中广泛使用的技术，它们共同构成了一个强大的框架，用于构建高度交互性和动态的Web应用程序。AJAX允许在不刷新整个页面的情况...

    ajax的DWR框架入门例子

    在这个"ajax的DWR框架入门例子"中，我们将深入理解DWR如何工作以及如何在实际项目中应用。这个例子包含了源代码和调试成功的案例，这意味着我们可以直接运行和学习，而无需从零开始搭建环境。 首先，DWR的基本概念...

    dwr框架的使用简介

    本文通过一个具体的示例——无限级树型菜单的实现，展示了如何使用DWR框架简化AJAX应用的开发过程。该示例主要涉及以下几个步骤： 1. **服务器端Java类设计**：首先需要定义服务器端的Java类，这些类包含了将被...

    基于Ajax技术的DWR框架的研究与应用

    综上所述，DWR框架作为一种基于Ajax技术的解决方案，在简化前后端通信方面发挥着重要作用。它不仅降低了开发难度，还提高了Web应用程序的整体性能。随着Web开发技术的不断进步和发展，DWR将继续扮演重要角色，并为...

    Ajax技术及其DWR框架实现

    ### Ajax技术及其DWR框架实现 #### 一、引言 随着互联网技术的快速发展，Web应用的需求日益增加，用户体验成为了衡量Web应用优劣的重要标准之一。传统的Web应用往往过于注重后端逻辑处理，忽视了前端体验的重要性...

    ajax框架：dwr实战.pdf

    ajax框架：dwr实战.pdfajax框架：dwr实战.pdfajax框架：dwr实战.pdfajax框架：dwr实战.pdfajax框架：dwr实战.pdf

    ajax dwr 框架实现二级联动下拉列表源码

    **Ajax DWR 框架实现二级联动下拉列表源码详解** Ajax（Asynchronous JavaScript and XML）是一种在无需刷新整个网页的情况下，能够更新部分网页的技术。DWR（Direct Web Remoting）则是一个用于Java web应用的开源...

    SSH框架+Ajax(运用dwr框架)综合小实例

    标题中的“SSH框架+Ajax(运用dwr框架)综合小实例”指的是在Web开发中，使用Struts2、Spring和Hibernate三大主流Java EE框架（SSH）结合Ajax技术，并通过Direct Web Remoting (DWR) 框架进行前端与后端交互的一个实战...

    SSH框架Ajax(运用dwr框架)综合小实例

    【整合SSH与Ajax】DWR框架可以与SSH框架结合，使得Struts的Action可以直接与JavaScript交互，实现在不刷新页面的情况下更新数据。在SSH框架中，通过DWR，前端的Ajax请求可以调用后台的Java服务，处理业务逻辑，然后...

    SSH框架+Ajax(运用dwr框架)综合实例

    通过这种方式，SSH框架提供了业务逻辑和数据访问，而Ajax（DWR）则增强了用户界面的交互性，使得Web应用具有更好的响应性和用户体验。 总结来说，SSH框架+Ajax（DWR）的组合提供了一种强大的开发模式，能够构建复杂...

Magicbox
Ask-but
我的问答 FAQ | 勋章

相关推荐

已解决问题

未解决问题

排行榜

Global site tag (gtag.js) - Google Analytics