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 相关文章推荐
js类型检查实现代码
Oct 29 Javascript
基于jquery的固定表头和列头的代码
May 03 Javascript
JavaScript中的noscript元素属性位置及作用介绍
Apr 11 Javascript
jQuery中outerWidth()方法用法实例
Jan 19 Javascript
JavaScript使用Replace进行字符串替换的方法
Apr 14 Javascript
详解Bootstrap的iCheck插件checkbox和radio
Aug 24 Javascript
JavaScript 详解预编译原理
Jan 22 Javascript
vue结合element-ui使用示例
Jan 24 Javascript
vue input输入框关键字筛选检索列表数据展示
Oct 26 Javascript
vue el-table实现自定义表头
Dec 11 Javascript
如何解决jQuery 和其他JS库的冲突
Jun 22 jQuery
vue 遮罩层阻止默认滚动事件操作
Jul 28 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定义字符串的四种方式详解
2018/02/06 PHP
php获取手机端的号码以及ip地址实例代码
2018/09/12 PHP
Laravel timestamps 设置为unix时间戳的方法
2019/10/11 PHP
又一个图片自动缩小的JS代码
2007/03/10 Javascript
Javascript 面试题随笔
2011/03/31 Javascript
js String对象中常用方法小结(字符串操作)
2012/01/27 Javascript
一个html5播放视频的video控件只支持android的默认格式mp4和3gp
2014/05/08 Javascript
简单易用的倒计时js代码
2014/08/04 Javascript
Javascript基础知识(二)事件
2014/09/29 Javascript
让javascript加载速度倍增的方法(解决JS加载速度慢的问题)
2014/12/12 Javascript
JavaScript设计模式之原型模式(Object.create与prototype)介绍
2014/12/28 Javascript
使用命令对象代替switch语句的写法示例
2015/02/28 Javascript
jQuery的position()方法详解
2015/07/19 Javascript
js实现鼠标点击文本框自动选中内容的方法
2015/08/20 Javascript
jQuery简单入门示例之用户校验demo示例
2016/07/09 Javascript
JavaScript实现类似拉勾网的鼠标移入移出效果
2016/10/27 Javascript
浅谈javascript的url参数parse和build函数
2017/03/04 Javascript
vuex的使用及持久化state的方式详解
2018/01/23 Javascript
vue项目中极验验证的使用代码示例
2019/12/03 Javascript
JS中准确判断变量类型的方法
2020/06/01 Javascript
详谈Object.defineProperty 及实现数据双向绑定
2020/07/18 Javascript
Vue管理系统前端之组件拆分封装详解
2020/08/23 Javascript
Python中AND、OR的一个使用小技巧
2015/02/18 Python
pandas获取groupby分组里最大值所在的行方法
2018/04/20 Python
TensorFlow数据输入的方法示例
2018/06/19 Python
使用python对文件中的数值进行累加的实例
2018/11/28 Python
python 获取图片分辨率的方法
2019/01/08 Python
django基于存储在前端的token用户认证解析
2019/08/06 Python
Mac安装python3的方法步骤
2019/08/09 Python
解决pycharm不能自动补全第三方库的函数和属性问题
2020/03/12 Python
世界上最全面的草药补充剂和顶级品牌维生素网站:HerbsPro
2019/01/20 全球购物
工程造价专业求职信
2014/07/17 职场文书
实习指导教师评语
2014/12/30 职场文书
档案管理员岗位职责
2015/02/12 职场文书
初一英语教学反思
2016/02/15 职场文书
解决Vmware虚拟机安装centos8报错“Section %Packages Does Not End With %End. Pane Is Dead”
2022/06/01 Servers