勉强将四级联动给搞定了,之所以说勉强,是因为点击第二个下拉框的时候刷新了页面。因为之前有二级联动的实例,所以可以将四个下拉框分成两份。第一个跟第二个联动,第三个跟第四个联动,当然这里用dwr实现没问题。问题就在第二个跟第三个的联动,起初我觉得问题不大,只要加一个方法就可以了,中间还是出现了很多疑问:
1、 DWRUtil.addOptions(situs, situses, "goodsId", "goodsName"); 起初在取值的时候觉得动态添加到下拉框的值应该是可以用document对象进行取值的,但不知道为什么取不到?貌似动态添加表格时可以取到js中添加的值:
//添加复选框对象
var newNameTD0=newTR.insertCell(0);
newNameTD0.setAttribute("align","center");
newNameTD0.innerHTML ='<td align="center" colspan="2" height="22"><input type="checkbox" id="oneCheck" name="oneCheck" onclick=""/></td><td><input type="hidden" id="Id" name="pkId" value="" /></td><td><input type="hidden" id="add" name="addScore" value="" /></td>';
2、第二个疑问是我从来没碰到过也没不知道怎么实现的。四级联动jsp代码如下,不知道实现,所以这里的代码没改,原样如下:
<td align="right">产品大类</td>
<td>
<select name="selectBig" id="selectBig" onchange="onloadSmall('selectBig','selectSmall');" style="width:150px">
<option value="null"></option>
<s:iterator value="#request.bigs" id="big">
<option value="${big.goodsId }">${big.goodsName }</option>
</s:iterator>
</select>
</td>
<td>产品小类</td>
<td>
<select name="selectSmall" id="selectSmall" style="width:150px" onchange="onloadProduct();">
<option value=""></option>
</select>
</td>
<td align="right">产品名称 </td>
<td>
<select id="goodsSelect" style="width:180px" onchange="onType('goodsSelect','goodsType')">
<option value="null"></option>
<s:iterator value="#request.goodses" id="g">
<option value="${g.goodsId }~!${g.goodsType }~!${g.goodsName }~!${g.unitId }~!${g.unitName }">${g.goodsName }</option>
</s:iterator>
</select>
</td>
<td align="right">型 号 </td>
<td >
<select id="goodsType" style="width:180px">
</select>
</td>
在我看来凡是用标签iterator 遍历的都是action中取出来的,大类是在前面一个请求的时候值就可以取出来了,但是后面的下拉框取值必须得在前一个点击的时候才能去取值。那么就意味着上面的商品名称是能用标签取值了,只能用这个DWRUtil.addOptions(situs, situses, "goodsId", "goodsName"); 这样取值了。但问题的关键是第三个下拉框的值是通过小类别的id取值的,那么第二个下拉框在反复取值时也可以这样获取值吗?:
var smaillId = window.document.getElementById("selectSmall").value;
var small = window.document.getElementById("selectSmall");
smallName = small.options[small.selectedIndex ].innerText;
如果能我想后面应该就简单了,那么我现在做的就变得复杂多了。但同时我又感觉今天做的这个给我一个很好的启发,把整个要实现的功能看做整体,从整体中还可以分块来做,分成的小块是很容易的。四级联动可以看成是两个两级联动,中间第二级与第三极经过了action,取值稍微复杂点。在我看来至少解决问题的思路还是挺好的。
分享到:
相关推荐
总的来说,"dwr实现的四级联动"是一个结合了前端动态交互和后端数据处理的典型应用场景,它要求开发者具备良好的JavaScript基础、DWR使用经验,以及对服务器端数据操作的理解。通过实践这样的项目,开发者可以提升...
**Ajax DWR 框架实现二级联动下拉列表源码详解** Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。DWR(Direct Web Remoting)则是一个用于Java web应用的开源...
标题中的“dwr 实现2级联动”指的是在Web开发中使用Direct Web Remoting (DWR)框架来实现页面上的两级联动效果。DWR是一种Java库,它允许JavaScript和Java在浏览器与服务器之间进行实时通信,类似于AJAX,但更加强大...
【DWR实现三级联动(2)】的知识点详解 DWR (Direct Web Remoting) 是一个JavaScript库,它允许Web应用程序直接与Java后端进行交互,实现Ajax功能,即在不刷新整个页面的情况下更新部分网页内容。在这个场景中,DWR...
在“dynamic.rar”这个压缩包中,我们可能找到了一个关于使用DWR实现两级联动的例子。两级联动通常指的是在一个下拉列表的选择会影响另一个下拉列表的选项,这种交互常见于省市区选择、产品分类等场景。 DWR的核心...
### DWR实现省市县三级联动的关键技术点 #### 一、DWR简介及应用场景 - **DWR**(Direct Web Remoting)是一种简化Ajax应用程序开发的框架,它使得客户端JavaScript可以直接调用服务器端的Java方法变得简单易行。在...
本示例主要展示了如何使用纯JSP和Direct Web Remoting (DWR)技术来构建一个功能丰富的用户界面,其中包括三级联动下拉选择菜单、无刷新联动、用户存在性判断以及模拟Google搜索效果的功能。DWR是一种JavaScript库,...
在本文中,我们将探讨如何使用纯JSP和Direct Web Remoting (DWR) 实现一个三级联动下拉选择菜单。这种技术通常用于地理信息系统或组织结构等需要分层次选择的场景,用户可以从一系列相关的下拉菜单中进行选择,每个...
在Web开发中,二级联动是一种常见的交互设计,用于在两个下拉框或列表之间建立关联,通常是基于用户在第一个选择中的选项动态更新第二个选择项。在这种场景中,`AJAX (Asynchronous JavaScript and XML)` 和 `DWR ...
总结来说,DWR提供了一个强大而简便的机制,使得在Struts2这样的MVC框架中实现三级联动下拉菜单成为可能,提高了Web应用的交互性和响应性。通过合理配置和编程,我们可以创建出高效且用户友好的Web界面。
至此,我们就实现了DWR和Spring集成的下拉框联动实例。当用户在`parentSelect`中选择一个值,`updateChildSelect`函数会被调用,通过DWR向服务器发送请求,获取到新的`childSelect`选项,并更新下拉框内容。这种方式...
在这个项目中,我们关注的是如何利用DWR实现一个三级联动的下拉菜单。这种交互式菜单在用户界面设计中常见,用于在多个选项之间建立关联,如省份-城市-区县的选择,以提供更加精细化的筛选。 首先,我们需要理解DWR...
jQuery,一个轻量级、高性能的JavaScript库,结合Direct Web Remoting (DWR) 技术,能够方便地实现在输入时动态过滤下拉框选项,提供快速、实时的搜索结果。DWR是一种在浏览器和服务器之间进行异步通信的技术,无需...
标题 "DWR实现省市县三级联动小例子" 暗示了这个压缩包可能包含一个使用Direct Web Remoting (DWR) 技术构建的示例项目,该示例展示了如何实现在网页上进行省、市、县三级联动选择的功能。这种功能在很多中国的网站...
SSH+dWR实现三级联动是一种常见的Web开发技术,用于构建动态、交互性强的Web应用程序。SSH是Spring、Struts和Hibernate三个开源框架的缩写,它们分别负责应用的依赖注入、MVC模式和对象关系映射。DWR(Direct Web ...
在二级联动菜单中,当用户选择一级菜单时,Ajax会异步请求服务器端的Java方法,这些方法由DWR暴露给前端。服务器端收到请求后,通过`DepartmentDAO`或`EmployeeDAO`获取相关数据,并将结果返回给前端。前端接收到...
本篇主要讨论如何利用SSH框架和DWR来实现省市二级联动效果。 省市二级联动通常是指在一个下拉菜单选择省份后,另一个下拉菜单会动态加载对应的市一级的数据。这种功能在很多网站的地址填写环节中常见,它可以提高...
在这个“DWR实现的三级联动链表的例子”中,我们将探讨如何使用DWR创建一个能够动态更新的三级联动列表,这种功能常见于如地区选择、产品分类等场景。 首先,我们需要理解DWR的基本工作原理。DWR通过在浏览器端创建...
在这个“ajaxdwr select二级联动”的场景中,我们将讨论如何利用这两种技术实现下拉菜单的级联选择效果。 Ajax是一种在无需刷新整个页面的情况下,能够更新部分网页的技术。它通过JavaScript发送异步请求到服务器,...
在本主题中,“dwr框架实现下拉框的连动”涉及到的是如何使用DWR来实现在网页中两个或多个下拉框之间的联动效果,即当用户在一个下拉框中选择一个选项时,另一个下拉框的内容会根据所选选项自动更新。 一、DWR框架...