js动态添加删除,后台取数据(示例代码)


Posted in Javascript onNovember 25, 2013

环境描述:就像你一般在论坛上发表文章,可能带附件,附件的数量是你手动添加删除的!!
/************************************************************************
*** 添加审批表单模板
************************************************************************/
// 增长的索引
var itemIndex = 1000;
// 数量
var counter = 0;
// 模板
var itemTemplate = '';
itemTemplate += '<div id="item_#itemIndex#" style="width: 100%;">';
itemTemplate += '   <span style="width: 80px">表单字段</span>';
itemTemplate += '   <input type="text" name="flowFormFieldCfgElement(#itemIndex#).name" style="width: 205px;"/>';
itemTemplate += '   值类型 <select name="flowFormFieldCfgElement(#itemIndex#).valueType">';
itemTemplate += '       <option value="java.lang.String" selected>字符串</option>';
itemTemplate += '       <option value="java.lang.Integer">数字(整数)</option>';
itemTemplate += '       <option value="java.util.Date">日期(yyyy-MM-dd)</option>';
itemTemplate += '   </select>';
itemTemplate += '   <input type="button" class="btnDelItem" onclick="delItem(#itemIndex#)" value="删除">';
itemTemplate += '</div>';

// 添加
function addItem() {
var s = itemTemplate.replace(/#itemIndex#/g, itemIndex);
$("#divFormFields").append(s);
itemIndex ++;
counter ++;
}

// 删除
function delItem(index) {
$("#item_" + index).remove();
counter = counter - 1;
}

 

public class FlowFormConfigActionForm extends ActionForm {
private int id;
private String name;
private String processName;

private String formFillTemplatePath;
private String formShowTemplatePath;
private Map<String, FlowformFieldConfig> flowFormFieldCfgMap = new TreeMap<String, FlowformFieldConfig>();

/** 表单复杂属性 */
public FlowformFieldConfig getFlowFormFieldCfgElement(String key){
if(!flowFormFieldCfgMap.containsKey(key)){
flowFormFieldCfgMap.put(key, new FlowformFieldConfig());
}
return flowFormFieldCfgMap.get(key);
}

*U*****

 

public class FlowformFieldConfig {
private int id;
private String name;
private Class<?> valueType;

 

主要要原理是:struts1.*在jsp显示的时候,会先从formbean里通过get***方法拿出属性的值!!

flowFormFieldCfgElement(#itemIndex#).name 这是核心,如果flowFormFieldCfgElement(#itemIndex#)为空的话,就会出错,所以在/** 表单复杂属性 */
public FlowformFieldConfig getFlowFormFieldCfgElement(String key){
if(!flowFormFieldCfgMap.containsKey(key)){
flowFormFieldCfgMap.put(key, new FlowformFieldConfig());
}
return flowFormFieldCfgMap.get(key);
}
做了判断!!
如果还有不懂的人可以给我留言!!

Javascript 相关文章推荐
jQuery ui 1.7更新小结
Aug 15 Javascript
js 判断checkbox是否选中的实现代码
Nov 23 Javascript
Javascript图像处理思路及实现代码
Dec 25 Javascript
JavaScript的21条基本知识点
Mar 04 Javascript
JavaScript中神奇的call()方法
Mar 12 Javascript
浅谈JavaScript 的执行顺序
Aug 07 Javascript
基于jQuery实现返回顶部实例代码
Jan 01 Javascript
Vue组件之全局组件与局部组件的使用详解
Oct 09 Javascript
js实现页面多个日期时间倒计时效果
Jun 20 Javascript
基于vue3.0.1beta搭建仿京东的电商H5项目
May 06 Javascript
基于vue实现探探滑动组件功能
May 29 Javascript
uniapp实现可以左右滑动导航栏
Oct 21 Javascript
javascript新建标签,判断键盘输入,以及判断焦点(示例代码)
Nov 25 #Javascript
jQuery中获取checkbox选中项等操作及注意事项
Nov 24 #Javascript
javascript 弹出的窗口返回值给父窗口具体实现
Nov 23 #Javascript
javascript 实现字符串反转的三种方法
Nov 23 #Javascript
Javascript 鼠标移动上去 滑块跟随效果代码分享
Nov 23 #Javascript
jquery实现图片滚动效果的简单实例
Nov 23 #Javascript
js图片向右一张张滚动效果实例代码
Nov 23 #Javascript
You might like
php数组声明、遍历、数组全局变量使用小结
2013/06/05 PHP
PDO::beginTransaction讲解
2019/01/27 PHP
JS预览图像将本地图片显示到浏览器上
2013/08/25 Javascript
javascript常见操作汇总
2014/09/03 Javascript
javascript实现全角与半角字符的转换
2015/01/07 Javascript
JQuery中DOM加载与事件执行实例分析
2015/06/13 Javascript
简述JavaScript的正则表达式中test()方法的使用
2015/06/16 Javascript
原生js实现图片轮播特效
2015/12/18 Javascript
JS和jQuery使用submit方法无法提交表单的原因分析及解决办法
2016/05/17 Javascript
jQuery增加、删除及修改select option的方法
2016/08/19 Javascript
nodejs中art-template模板语法的引入及冲突解决方案
2017/11/07 NodeJs
vue中实现methods一个方法调用另外一个方法
2018/02/08 Javascript
微信小程序获取用户绑定手机号方法示例
2019/07/21 Javascript
vue日历/日程提醒/html5本地缓存功能
2019/09/02 Javascript
Javascript如何实现双指控制图片功能
2020/02/25 Javascript
[03:23:49]2016.12.17日完美“圣”典全回顾
2016/12/19 DOTA
[56:14]Fnatic vs OG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
Python全局变量操作详解
2015/04/14 Python
Pyhton中单行和多行注释的使用方法及规范
2016/10/11 Python
python 时间信息“2018-02-04 18:23:35“ 解析成字典形式的结果代码详解
2018/04/19 Python
详解Python静态网页爬取获取高清壁纸
2019/04/23 Python
python频繁写入文件时提速的方法
2019/06/26 Python
python爬虫把url链接编码成gbk2312格式过程解析
2020/06/08 Python
Python 分布式缓存之Reids数据类型操作详解
2020/06/24 Python
Python读写csv文件流程及异常解决
2020/10/20 Python
配置管理计划的主要内容有哪些
2014/06/20 面试题
如何写出好的Java代码
2014/04/25 面试题
四种会话跟踪技术
2015/05/20 面试题
2014的自我评价
2014/01/13 职场文书
学生逃课检讨书1000字
2014/10/20 职场文书
2015年安全员工作总结范文
2015/04/22 职场文书
学校世界艾滋病日宣传活动总结
2015/05/05 职场文书
毕业设计答辩开场白
2015/05/29 职场文书
贷款收入证明格式
2015/06/24 职场文书
解析高可用Redis服务架构分析与搭建方案
2021/06/20 Redis
Elasticsearch 索引操作和增删改查
2022/04/19 Python