web页面
关于动态新增表格的js
<script type="text/javascript">
function addtabfun(){
var tr = $("#itb tr").eq(1).clone();
var last=$("#itb tr").last().attr("index");
if(last==null){
last="0";
}
var tabsize=parseInt(last) + 1;
$(tr).attr("index",tabsize);
var lasttr=$("#itb tr").last()
var name=$("select",lasttr).attr("name");
var startindex=name.indexOf("[")+1;
var endindex=name.indexOf("]");
name=name.substring(0,startindex)+(parseInt(name.substring(startindex,endindex))+1)+name.substring(endindex,name.length);
$("select",tr).attr("name",name);
tr.find("td").get(1).innerHTML = "<input type=\"text\" name=\"punishGist\" class=\"punishGist\"/>";
tr.find("td").get(2).innerHTML = "扣<input type=\"text\" name=\"score\" class=\"score\"/>分";
tr.show();
tr.appendTo("#itb");
}
</script>
页面中itb表格
<table cellSpacing=1 cellPadding=0 width="100%" align=center bgColor=#cccccc border=0 id="itb">
<tr class="rowoutdark2">
<td width="15%" align="center">案件性质</td>
<td width="15%" align="center">处理依据</td>
<td width="17%" align="center">处理结果 </td>
<td width="10%" align="center">
<c:if test="${not requestScope.view }"> <a href="#" onClick="addtabfun()">新增</a></c:if>
</td>
</tr>
<tr class="rowoutdarkwhite" style="display: none">
<td align="center">
<select name="dedustionchilds[0].badStandardId" class="badStandard">
<option value="">请选择违规企业行为</option>
<c:forEach items="${request.badStandarList}" var="item">
<option value="${item.badStandardId}">${item.badStandardCode}</option>
</c:forEach>
</select>
</td>
<td align="center"><input type="text" name="punishGist" class="punishGist"/></td>
<td align="center">扣<input type="text" name="score" class="score"/>分</td>
<td align="center"><a href="#" onClick="dlttabfun(this)">删除</a></td>
</tr>
<c:if test="${not empty dedustionchilds}">
<c:forEach items="${dedustionchilds}" var="item" varStatus="mm">
<tr class="rowoutdarkwhite">
<td align="center">
<input type="hidden" name="dedustionchilds[${mm.count}].deductionPointSubId" value="${item.deductionPointSubId}"/>
<select name="dedustionchilds[${mm.count}].badStandardId" class="badStandard reloaddata">
<option value="">请选择违规企业行为</option>
<c:forEach items="${request.badStandarList}" var="iitem">
<option value="${iitem.badStandardId}" <c:if test="${iitem.badStandardId==item.badStandardId}">selected</c:if> >${iitem.badStandardCode}</option>
</c:forEach>
</select>
</td>
<td align="center"><input type="text" name="punishGist" class="punishGist"/></td>
<td align="center">扣<input type="text" name="score" class="score"/>分</td>
<td align="center"><a href="#" onClick="dlttabfun(this)">删除</a></td>
</tr>
</c:forEach>
</c:if>
<c:if test="${ empty dedustionchilds}">
<tr class="rowoutdarkwhite">
<td align="center"><s:select list="%{#request.badStandarList}" name="dedustionchilds[1].badStandardId" cssClass="badStandard" listKey="badStandardId" listValue="badStandardCode" headerKey="" headerValue="请选择违规企业行为" /></td>
<td align="center"><input type="text" name="punishGist" class="punishGist"/></td>
<td align="center">扣<input type="text" name="score" class="score"/>分</td>
<td align="center"><a href="#" onClick="dlttabfun(this)">删除</a></td>
</tr>
</c:if>
</table>
页面中根据下拉列表获取数据内容并填充到对应字段js
<script language="JavaScript">
function badstandchange(that){
if($(that).val() != ""){
$.ajax({
type:'post',
data:'badStandardId='+$(that).val(),
dataType:'json',
url:'<%=request.getContextPath()%>/credit/deductionPointAction!queryViewData.action',
success:function(info){
setitemvalue(that,info);
}
});
}
}
function setitemvalue(sel,val){
var p=$(sel).parent().parent();
$("input.score",p).val(val.score);
$("input.punishGist",p).val(val.punishGist);
}
$(document).ready(function() {
$("select.reloaddata").each(function(index,obj){
badstandchange(obj);
});
$("select.badStandard").live('change',function(){
badstandchange(this);
});
});
</script>
分享到:
相关推荐
1.下拉列表控件可以展开为菜单 2.下拉列表可以建立子项
使用javascript实现table动态增加删除行列。
最近在使用Bootstrap table ,有一个在某一列添加一个下拉列表,并且通过 “getAllSelections”方法获取所选行的需求,在实现这个功能的时,走了一些弯路,遇到了一些坑。所以今天总结出来,既是自己的学习,也分享...
网上书店系统
在修改部门页面中,会出现“部门负责人”下拉列表,下拉列表的选项默认加载出当前所选部门下的所有用户名称。如果当前部门下没有任何用户,则为空。点击“确定”按钮,如果更改了部门名称,则需验证新的部门名称是否...
12.2.4 新增的嵌入多媒体元素与交互性元素 231 12.2.5 新增的input元素的类型 232 12.2.6 废除的元素 233 12.3 新增的属性和废除的属性 234 12.3.1 新增的属性 234 12.3.2 废除的属性 236 12.4 全局...
新增分页跳转类型,两种:下拉列表框和文本框,系统默认为下拉列表框,(在实际开发中我们发现下拉列表框在分页数达到1000级以上的时候明显变慢,所以建议大家在分页数很大时使用文本框类型这样可以明显提高效率)...
新增分页跳转类型,两种:下拉列表框和文本框,系统默认为下拉列表框,(在实际开发中我们发现下拉列表框在分页数达到1000级以上的时候明显变慢,所以建议大家在分页数很大时使用文本框类型这样可以明显提高效率)...
新增分页跳转类型,两种:下拉列表框和文本框,系统默认为下拉列表框,(在实际开发中我们发现下拉列表框在分页数达到1000级以上的时候明显变慢,所以建议大家在分页数很大时使用文本框类型这样可以明显提高效率)...
2023年07月27日ModStartCMS发布v6.9.0版本,增加了以下16个特性: ...[系统优化] 数据表格新增弹窗到标签返回列表自动刷新 [系统优化] 系统主题色自动切换样式优化 [Bug修复] 二维码生成类中文字符异常问题修复
新增分页跳转类型,两种:下拉列表框和文本框,系统默认为下拉列表框,(在实际开发中我们发现下拉列表框在分页数达到1000级以上的时候明显变慢,所以建议大家在分页数很大时使用文本框类型这样可以明显提高效率)...
【新增】自定义模块脚本设计页面,可自由定义设置项目,支持单行文本、多行文本、单选多选、下拉选择 【新增】自定义模块脚本缓存模式选择,既可以使用系统缓存功能,也可使用脚本自己的缓存机制 【新增】全新设计...
c) 在工具栏中的列表框中选择区域,单击鼠标右键选择【修改区域名】,在标签“请输入新的区域名称”下方的下拉列表框中输入新的区域名称,按【Enter】键,当列表框中所选区域名改变时,此修改操作完成。 注:1.选择...
二、 增加单元格下拉列表框设置功能【设计器】 三、 增加宏替换功能(宏变量)的支持【设计器】 四、 增加IAcFuncionLib接口支持,以一种新的方式扩充函数库【SDK】 五、 增加LoadFromStream和SaveToStream方法及...
二、 增加单元格下拉列表框设置功能【设计器】 三、 增加宏替换功能(宏变量)的支持【设计器】 四、 增加IAcFuncionLib接口支持,以一种新的方式扩充函数库【SDK】 五、 增加LoadFromStream和SaveToStream方法及...
包含导航、颜色、字体、边框、图标、按钮、文字链接、单选框、多选框、输入框、计数器、选择器、级联选择器、开关、滑块、时间选择器、日期选择器、日期时间选择器、上传、评分、颜色选择器、穿梭框、表单、表格、...
下拉列表 多行文本框 H5新增内容 新增标签 新增属性 和 超链接 特殊字符 语义化标签 优势 H5新增语义化标签 CSS 作用 概念 特征 CSS引入方式 选择器 基础选择器 全局选择器/统用选择器 元素选择器 类选择器 id选择器...
01.新增:后台文章内容支持导出Excel表格文件,在文章树页面导出整站文章数据,在各栏目管理页面下导出各对应栏目的文章数据。 02.新增:手机端页面浏览支持,与电脑端数据同步,手机端浏览友好。 03.修复:调整了...
(三)考核知识点与考核要求 1、创建新用户帐户 2、桌面管理:排列图标、行列对齐、新建等 3、窗口操作:移动、放大、缩小、切换、排列和关闭等 4、使用菜单:下拉菜单和快捷菜单等 5、掌握工具栏 6、对话框的操作...