- 浏览: 6351857 次
- 性别:
- 来自: 一片神奇的土地
文章分类
- 全部博客 (745)
- JQuery (25)
- JS (33)
- 数据库 (59)
- Java基础 (56)
- JSON (8)
- XML (8)
- ireport (7)
- 设计模式 (10)
- 心情 (14)
- freemarker (1)
- 问题 (15)
- powerdesigner (2)
- CSS (15)
- DWR (4)
- tomcat (16)
- Hibernate (12)
- Oracle (7)
- Struts (7)
- Spring (34)
- JSP (23)
- 需学习 (64)
- 工具类库 (63)
- Maven (14)
- 笔试题 (34)
- 源码学习 (31)
- 多线程 (39)
- Android (32)
- 缓存 (20)
- SpringMVC (14)
- jQueryEasyUi (12)
- webservice-RPC (13)
- ant (1)
- ASP.NET (10)
- 正则表达式 (3)
- Linux (15)
- JBoss (1)
- EJB (3)
- UML (2)
- JMS (3)
- Flex (8)
- JSTL (2)
- 批处理 (5)
- JVM (16)
- 【工具】 (16)
- 数据结构 (29)
- HTTP/TCP/Socket (18)
- 微信 (1)
- tomcat源码学习 (15)
- Python (30)
- 主机 (2)
- 设计与架构 (19)
- thrift-RPC (2)
- nginx (6)
- 微信小程序 (0)
- 分布式+集群 (12)
- IO (1)
- 消息队列 (4)
- 存储过程 (8)
- redis (9)
- zookeeper (5)
- 海量数据 (5)
最新评论
-
360pluse:
技术更新,战术升级!Python爬虫案例实战从零开始一站通网盘 ...
Python爬虫实战:Scrapy豆瓣电影爬取 -
18335864773:
推荐用 pageoffice 组件生成 word 文件。
JAVA生成WORD工具类 -
jjhe369:
LISTD_ONE 写道起始地址为163.135.0.1 结束 ...
IP地址与CIDR -
baojunhu99:
private final int POOL_SIZE = 5 ...
使用CompletionService获取多线程返回值 -
LovingBaby:
胡说,javascript 运行时是单线程的,event lo ...
Ajax请求是否可以实现同步
代码(去掉部分css细节,只关注主要功能):
<tr> <td><br />Additional charges item(s)</td> </tr> <tr> <td> <table id="additionalItemsPanel" name="additionalItemsPanel" border="0"> <tr> <td width="5%"></td> <td width="29%">Type</td> <td width="1%"></td> <td width="39%">Description</td> <td width="1%"></td> <td width="19%">Charge per person</td> <td width="1%"></td> <td width="5%"></td> </tr> <tr id="additionalItemTr1"> <td>Item</td> <td> <select id="addItemType1" name="addItemType1" onchange=""> <option value="">Select additional charge items</option> <c:forEach items="${ADDITIONALITEMSLIST}" var="item"> <option value="${item.code}">${item.code } - ${item.itemnameEn }</option> </c:forEach> </select> </td> <td></td> <td> <input type="text" id="addItemDescription1" name="addItemDescription1"/> </td> <td></td> <td> <input type="text" id="addItemPrice1" name="addItemPrice1"> </td> <td></td> <td> <input id="additionalItemAddBtn" name="additionalItemAddBtn" type="button" value="+" onClick="additionalItemOP('+', '')"> <input id="additionalItemDelBtn" name="additionalItemDelBtn" type="button" value="-" onClick="additionalItemOP('-', 'additionalItemTr1')"> </td> </tr> </table> </td> </tr>
模块添加与删除:
var ADDITIONAL_ITEMS_ROWS_CNT = 1; var addiItemIndex = 2; function additionalItemOP( op, idName) { if( op == '+') { var rowSize = $('additionalItemsPanel').rows.length; if(rowSize > 6) { alert('You can\'t continue to add items!'); return; } var tmpinnerhtml = []; tmpinnerhtml.push( '<tr id="additionalItemTr'+addiItemIndex+'">' ); tmpinnerhtml.push( '<td>Item</td>' ); tmpinnerhtml.push( '<td>'); tmpinnerhtml.push( '<select id="addItemType'+addiItemIndex+'" name="addItemType'+addiItemIndex+'" onchange=""); tmpinnerhtml.push( '<option>Select additional charge items</option>' ); <c:forEach items="${ADDITIONALITEMSLIST}" var="item"> tmpinnerhtml.push( '<option value="${item.code}">${item.code } - ${item.itemnameEn }</option>' ); </c:forEach> tmpinnerhtml.push( '</select>'); tmpinnerhtml.push( '</td>'); tmpinnerhtml.push( '<td></td>'); tmpinnerhtml.push( '<td>'); tmpinnerhtml.push( '<input type="text" id="addItemDescription'+addiItemIndex+'" name="addItemDescription'+addiItemIndex+'"/>'); tmpinnerhtml.push( '</td>'); tmpinnerhtml.push( '<td></td>'); tmpinnerhtml.push( '<td>'); tmpinnerhtml.push( '<input type="text" id="addItemPrice'+addiItemIndex+'" name="addItemPrice'+addiItemIndex+'">'); tmpinnerhtml.push( '</td>'); tmpinnerhtml.push( '<td></td>'); tmpinnerhtml.push( '<td>'); tmpinnerhtml.push( '<input id="additionalItemAddBtn'+addiItemIndex+'" name="additionalItemAddBtn'+addiItemIndex+'" type="button" value="+" onClick="additionalItemOP(\'+\', \'\')">'); tmpinnerhtml.push( ' '); tmpinnerhtml.push( '<input id="additionalItemDelBtn'+addiItemIndex+'" name="additionalItemDelBtn'+addiItemIndex+'" type="button" value="-" onClick="additionalItemOP(\'-\', \'additionalItemTr'+addiItemIndex+'\')">'); tmpinnerhtml.push( '</td>'); tmpinnerhtml.push( '</tr>'); jQuery('#additionalItemsPanel tbody>tr:last').append( tmpinnerhtml.join('') ); addiItemIndex++; } else if (op == '-') { var rowSize = $('additionalItemsPanel').rows.length; if( rowSize <= 2 || idName == 'additionalItemTr1') { alert("First row can not be deleted!"); return; } if(!confirm("Do you confirm delete?")) return; jQuery('#' + idName).remove(); //注意remove时addiItemIndex值不减,这样保存时循环过程中可以获取所有行 } }
也可如此:
注意此处button的Id、name
另注意此处转义:
addcontent[addcontent.length] = "<input id='markupAddBtn"+index+"' name='markupAddBtn"+index+"' type='button' value='+' onClick='markupOP(\"+\", \"\")'>"; addcontent[addcontent.length] = "<input id='markupDelBtn"+index+"' name='markupDelBtn"+index+"' type='button' value='-' onClick='markupOP(\"-\", \"markupTr"+index+"\")'>";
1、保存到数据库JS(省略验证):
function doSave(){ var additionalitemtypeList = ''; var additionalitemnameList = ''; var additionalitempriceList = ''; for(var i=1; i<addiItemIndex; i++) { //addiItemIndex为添加模块时的全局变量 var additionalitemObj = $('additionalItemTr' + i); if ( !additionalitemObj ) continue; //必须加上这句,否则当删除了中间某一行,保存时由于该行已不存在,故$('addItemPrice'+i).value等都不存在,会报缺少对象而无法保存 var itemType = $('addItemType' + i).options[$('addItemType' + i).selectedIndex].value; if(additionalitemtypeList != "") { additionalitemtypeList += ',' + itemType.trim(); additionalitemnameList += ',' + $('addItemDescription' + i).value; additionalitempriceList += ',' + $('addItemPrice' + i).value; } else { additionalitemtypeList += itemType.trim(); additionalitemnameList += $('addItemDescription' + i).value; additionalitempriceList += $('addItemPrice' + i).value; } } $('additionalitemtype').value = additionalitemtypeList; $('additionalitemname').value = additionalitemnameList; $('additionalitemprice').value = additionalitempriceList; }
form中: <html:hidden property="additionalitemtype" styleId="additionalitemtype"/> <html:hidden property="additionalitemname" styleId="additionalitemtype"/> <html:hidden property="additionalitemprice" styleId="additionalitemtype"/>
实现类中分割各个List:
public String update(ActionForm form, HttpServletRequest request,HttpServletResponse response) throws SystemException { String additionalitemtype = tariffForm.getString("additionalitemtype"); String additionalitemname = tariffForm.getString("additionalitemname"); String additionalitemprice = tariffForm.getString("additionalitemprice"); String[] additionalitemtypeList = additionalitemtype.split(","); String[] additionalitemnameList = additionalitemname.split(","); String[] additionalitempriceList = additionalitemprice.split(","); TariffUtils tariffUtils = new TariffUtils(); Tariff tariffBean = (Tariff)tariffForm.get("tariffBean"); tariffUtils.setAdditionalitemtypes(tariffBean, additionalitemtypeList,true); tariffUtils.setAdditionalitemnames(tariffBean, additionalitemnameList,true); tariffUtils.setAdditionalitemprices(tariffBean, additionalitempriceList,true); }
TariffUtils.java: public void setAdditionalitemtypes(Tariff tariffBean, String[] additionalitemtypes, boolean isUpdate) { if(isUpdate) { for(int i=0; i<6; i++) { if(i == 0) { tariffBean.setAdditionalitemtype1(null); } else if(i == 1) { tariffBean.setAdditionalitemtype2(null); } else if(i == 2) { tariffBean.setAdditionalitemtype3(null); } else if(i == 3) { tariffBean.setAdditionalitemtype4(null); } else if(i == 4) { tariffBean.setAdditionalitemtype5(null); } else if(i == 5) { tariffBean.setAdditionalitemtype6(null); } } } if(additionalitemtypes.length == 0) return; //将每一行的type值赋给Bean for(int i=0; i<additionalitemtypes.length; i++) { String code = additionalitemtypes[i]; if(i == 0) { tariffBean.setAdditionalitemtype1(code); } else if(i == 1) { tariffBean.setAdditionalitemtype2(code); } else if(i == 2) { tariffBean.setAdditionalitemtype3(code); } else if(i == 3) { tariffBean.setAdditionalitemtype4(code); } else if(i == 4) { tariffBean.setAdditionalitemtype5(code); } else if(i == 5) { tariffBean.setAdditionalitemtype6(code); } } } //注意Tariff类中属性分别为: // private String additionalitemtype1; // private String additionalitemtype2; // private String additionalitemtype3; // 。。。
到此数据保存成功!
2、进入页面时读取显示:
public String read(ActionForm form, HttpServletRequest request, HttpServletResponse response) throws SystemException { TariffUtils tariffUtils = new TariffUtils(); tariffForm.set("additionalitemtype", tariffUtils.getAdditionalitemtypes(tmpTariff)); tariffForm.set("additionalitemname", tariffUtils.getAdditionalitemnames(tmpTariff)); tariffForm.set("additionalitemprice", tariffUtils.getAdditionalitemprices(tmpTariff)); }
public String getAdditionalitemtypes(Tariff tariff) { StringBuffer sb = new StringBuffer(); if(tariff.getAdditionalitemtype1() != null && !"".equals(tariff.getAdditionalitemtype1().trim())) { sb.append(tariff.getAdditionalitemtype1().trim()); } if(tariff.getAdditionalitemtype2() != null && !"".equals(tariff.getAdditionalitemtype2().trim())) { sb.append("," + tariff.getAdditionalitemtype2().trim()); } if(tariff.getAdditionalitemtype3() != null && !"".equals(tariff.getAdditionalitemtype3().trim())) { sb.append("," + tariff.getAdditionalitemtype3().trim()); } ... return sb.toString(); }
JSP页面:
window.onload = function(){ initAdditionalItems(); }
function initAdditionalItems() { var additionalitemtype = $('additionalitemtype').value; var additionalitemname = $('additionalitemname').value; var additionalitemprice = $('additionalitemprice').value; //存在,表明有多行additionalItem if( additionalitemtype.indexOf(',') > 0) { var additionalitemtypelist = additionalitemtype.split(','); var additionalitemnamelist = additionalitemname.split(','); var additionalitempricelist = additionalitemprice.split(','); //因为进入时JSP页面中只有第一行,故先将其赋值additionalItem; //其他行需要先 additionalItemOP('+', '') 后再赋值 for (var i = 0, j = $('addItemType1').options.length; i < j; i++) { if ( $('addItemType1').options[i].value.trim() == additionalitemtypelist[0] ) { $('addItemType1').options[i].selected = true; break; } } if(additionalitemnamelist[0] == undefined) { $('addItemDescription1').value = ''; } else { $('addItemDescription1').value = additionalitemnamelist[0]; } if(additionalitempricelist[0] == undefined) { $('addItemPrice1').value = ''; } else { $('addItemPrice1').value = additionalitempricelist[0]; } var tmp = 2; var index = 1; for(var i = 0; i<additionalitemtypelist.length-1; i++) { additionalItemOP('+', ''); for (var k = 0, j = $('addItemType' + tmp).options.length; k < j; k++) { if ( $('addItemType'+tmp).options[k].value.trim() == additionalitemtypelist[index] ) { $('addItemType'+tmp).options[k].selected = true; break; } } if(additionalitemnamelist[index] == undefined) { $('addItemDescription'+tmp).value = ''; } else { $('addItemDescription'+tmp).value = additionalitemnamelist[index]; } if(additionalitemnamelist[index] == undefined) { $('addItemPrice'+tmp).value = ''; } else { $('addItemPrice'+tmp).value = additionalitempricelist[index]; } index ++; tmp ++; } //only one additional times result. } else { for (var i = 0, j = $('addItemType1').options.length; i < j; i++) { if ( $('addItemType1').options[i].value.trim() == additionalitemtype ) { $('addItemType1').options[i].selected = true; break; } } if(additionalitemname == undefined) { $('addItemDescription1').value = ''; } else { var additionalitemnamelist = additionalitemname.split(','); $('addItemDescription1').value = additionalitemnamelist[0]; } if(additionalitemprice == undefined) { $('addItemPrice1').value = ''; } else { var additionalitempricelist = additionalitemprice.split(','); $('addItemPrice1').value = additionalitempricelist[0]; } } }
。。。
发表评论
-
Form的onsubmit
2015-02-05 11:06 47761. <form class="for ... -
使文本框不可编辑[不太常用的方法]
2012-09-10 11:17 2422为了使本框不可编辑,我们可以使用下面几种方法 解决思路: 文本 ... -
C 标签使用
2012-07-26 12:16 2933<title>虚拟机管控</title&g ... -
显示结果排序
2012-05-04 14:15 1293<td width="9%" s ... -
select级联操作的简便方法
2012-04-18 15:07 7792<script type=&quo ... -
GuestName处理方法
2012-01-31 10:39 2164主要考虑如何设计,如何实现,如何思考! 效果: ... -
[基础]Map在JSP中的两种显示方式
2011-10-27 09:36 139111、 Java: for(EglSpecialRequ ... -
JSP自定义标签
2011-09-01 12:07 1720实际使用: <td style="text- ... -
[转]如何用div+css布局页面
2011-08-01 17:58 2294如今web2.0炒的很厉害, ... -
iframe总结 + window.open
2011-06-20 11:47 15974从frame中跳出并转向: parent.window. ... -
window.showModalDialog()
2011-06-01 15:23 3597window.open() 打开一个普通窗口 win ... -
一个星期中某一天存在即显示的思路
2011-05-31 17:48 11521、 days: 1,2,3,4,5,6,0 // ... -
批量更新时判断哪个需要更新
2011-04-06 16:03 1881<input type="checkbox ... -
JSP中循环二维数组 + 循环Map
2011-04-01 16:46 7264代码如下: <C:forEach items=&q ... -
使用Table的insertRow实现某一模块的复制
2011-03-21 14:16 3334实现的效果:点击+号添加一组 JSP页面: < ... -
[基础]由复选框实现的批量删除
2011-03-21 11:31 2999批量删除: 选中多个复选框: 每一条记录: ... -
table总结insertRow、deleteRow
2011-03-16 16:13 20505表格有几行: var trCnt = table.rows.l ... -
struts中用到的复选框和查询技巧
2011-03-09 11:06 123实现效果:1、选中复选框时,其后文本框显示,没选中时,隐藏 ... -
js实现的复选框选中时的批量操作
2011-03-04 14:22 57311. var checkedList = []; // sa ... -
利用getParameterNames实现一个按钮所有模块数据都提交
2010-11-27 13:13 15751.总结: 1、注意 ...
相关推荐
在51单片机编程中,温度模块的读取与数码管显示以及报警功能的实现是常见的应用之一。以下是对这个项目的详细解析: 首先,51单片机是一类广泛应用的微控制器,由Intel公司开发,以其简洁的指令集和广泛的可用资源...
基于PXI的处理器模块ATE(Automatic Test Equipment)设备设计与实现是一项在现代电子测试技术中的重要任务。随着科技的迅速进步,特别是在电子技术和计算机技术的推动下,自动测试系统已经成为确保处理器模块可靠...
在网页设计中,悬浮模块是一种常见的交互元素,它能够在用户滚动页面时始终保持在屏幕的某一固定位置,提供持续的导航或信息展示。本篇文章将详细解析“jquery版悬浮模块demo”所涉及的技术点,帮助你理解和实现类似...
很明显横向滑动的分页,第一反应就是使用ViewPager,毕竟只要通过自定义ViewPager,实现这个效果还是很容易,但是实际中问题时,当前模块是Recyclerview中某一个Holder,为了性能,肯定尽量使用Recyclerview去复用...
在实际开发中,可以根据需求调整透明度,或者实现动态透明效果,增加用户界面的视觉吸引力。同时,这也涉及到性能优化,因为过度的透明效果可能会对设备性能产生影响,需要权衡美观与性能之间的平衡。
模块是易语言中的一个关键概念,它是一组相关功能的集合,可以被其他程序调用,而DLL则是一种在运行时动态加载的代码库,可以在多个程序之间共享功能。 易语言模块(.ec文件)是由易语言5.72版本编写的,它包含了...
本系统采用B/S模式,采用现在使用广泛的ASP语言和对数据文件安全保护性极好的SQL Server2000设计开发出的一个实现在线考试的动态网站—基于Web的考试管理系统,也就是在线考试系统。该系统基本上具备一个网上数据...
在移动应用设计中,抽屉效果(Drawer Effect)是一种常见的导航模式,常见于许多应用程序,如QQ、微信等。这种效果允许用户通过从屏幕边缘滑动来打开一个隐藏的侧边栏,通常包含导航菜单、设置选项或者其他的附加...
10.3.5 转到某天、某周、某月及某年的实现 243 10.3.6 节日管理 245 10.3.7 提醒管理 249 第11章 文件批量处理器 11.1 概述 256 11.2 关键技术 256 11.2.1 文件流技术 256 11.2.2 文件解压缩技术 ...
例如,可以创建一个内存池,当不再需要某一对象时,不是立即释放,而是将其放入池中,供后续需要时再次使用。 6. **内存泄漏检测**:内存泄漏是程序中常见的问题,该模块可能包含了检测和预防内存泄漏的机制,确保...
分词功能(点击某一个分享,进入详情页的时候,会对该分享名称进行分词,并且加入到head中,利于网站seo)。 可能还有一些其他功能,通过查看源码可了解。 网站技术介绍: 1、采用语言,java 2、后台框架,struts2+...
它提供了模块化的设计,使得用户能够轻松构建复杂的网络模型,包括WSN、物联网(IoT)和移动自组网(MANET)等。omnet++的开源特性吸引了全球范围内的研究者和开发者,形成了丰富的社区资源和插件库,进一步增强了其...
使用者只需在自己的程序中引入这个模块,即可轻松实现窗口透明效果,而无需深入了解底层的API细节。通过这种方式,易语言提供了一种简单易用的方法,让开发者可以快速开发出具有窗口透明效果的应用程序。
无主均流法中,每个模块都可能成为输出电流最大的模块,从而避免了对某一特定模块的依赖。由于电路中二极管的存在,使得压降变化,这导致输出电流最大的模块始终处于一种轮换状态,由此产生的均流方式称为无主均流。...
JavaScript可能用于实现诸如加载更多文章、评论交互、点赞功能等动态效果。 其次,前端代码的模块化管理是现代开发的常态。这通常通过引入像CommonJS、ES6的import/export语法或者使用模块打包工具如Webpack来实现...
在IT领域,尤其是在Windows应用程序开发...在这个"完整版置超级列表框指定行列前景、背景色模块+例程(06.10.8更新)1.rar"压缩包中,我们很显然会找到一个专门针对超级列表框的编程模块和示例代码...
4. **闪烁效果实现**:通过定时器中断服务程序定期改变某个位选线的状态,实现闪烁效果。 5. **延时控制**:合理设置延时时间,确保数码管有足够的时间被点亮,并且不会因为显示时间过短而无法被人眼察觉。 通过...
原子插件就是这种思想的体现,它们是可复用的代码片段,专注于某一特定效果。 综上所述,"Jquery+CSS 原子插件 效果"是关于利用jQuery的强大功能和CSS的灵活性,创建出高效、简洁且可复用的动态效果。在实际开发中...
### 最新状元分销V2.0钻石版全开源纯净安装完美运营版+某猪微店系统+可任意二开 #### 一、简介 “最新状元分销V2.0钻石版”是一款专为电商和微店商家设计的分销管理系统。该版本支持全开源,意味着用户可以完全...
在JavaScript(JS)中实现类似雅虎首页的局部收缩效果是一项常见的前端开发任务,它可以提升网页的用户体验,尤其是在有限的空间内展示更多的信息。雅虎首页的收缩效果通常指的是当用户鼠标悬停在某个模块上时,该...