实现<table>标签的动态新增和后台接受<table>标签的方法

16lz 2021-01-22

1.遇到一个要实现<table>标签要在JSP页面实现手动可以新增行的问题。

2.公司的代码有以前前辈写的方法，加上自己的理解，盗用一下前辈的代码！嘻嘻~~

注：最重要的部分在JS里面实现。其实自己也看的不是很懂，一直以为是一个控件的调用。。

一定要注意下标，<input>标签的name是固定的字母+有序的数字。可以在后台循环取出。

JSP页面代码：

<script language="javascript" type="text/javascript">
function findObj(theObj, theDoc) {
var p, i, foundObj;
if (!theDoc)
theDoc = document;
if ((p = theObj.indexOf("?")) > 0 && parent.frames.length) {
theDoc = parent.frames[theObj.substring(p + 1)].document;
theObj = theObj.substring(0, p);
}
if (!(foundObj = theDoc[theObj]) && theDoc.all)
foundObj = theDoc.all[theObj];
for (i = 0; !foundObj && i < theDoc.forms.length; i++)
foundObj = theDoc.forms[i][theObj];
for (i = 0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
foundObj = findObj(theObj, theDoc.layers[i].document);
if (!foundObj && document.getElementById)
foundObj = document.getElementById(theObj);
return foundObj;

}

function AddSignRow() { //读取最后一行的行号，存放在txtTRLastIndex文本框中
var txtTRLastIndex = findObj("txtTRLastIndex", document);
var rowID = parseInt(txtTRLastIndex.value);

var signFrame = findObj("SignFrame", document);
var newTR = signFrame.insertRow(signFrame.rows.length);
newTR.id = "SignItem" + rowID;

var newStartPsamId = newTR.insertCell(0);
newStartPsamId.innerHTML = "<td width='130' align='center'><input name='StartPsamId" + rowID + "' id='StartPsamId"+rowID+"' type='text' class='required digits' minlength='15' maxlength='15' /></td>";

var newEndPsamId = newTR.insertCell(1);
newEndPsamId.innerHTML = "<td width='130' align='center'><input name='EndPsamId" + rowID + "' id='EndPsamId"+rowID+"' type='text' class='required digits' minlength='15' maxlength='15' /></td>";

var newStartUsed = newTR.insertCell(2);
newStartUsed.innerHTML = "<td width='130' align='center'><input type='text' name='startUsed"+ rowID +"' id='startUsed"+ rowID +"' class='required' onclick=\"WdatePicker({dateFmt: 'yyyy-MM-dd'})\"/></td>";
var newEffectDateStart = newTR.insertCell(3);
newEffectDateStart.innerHTML = "<td width='130' align='center'><input type='hidden' name='firstDay' id='firstDay' value='${firstDay }'/><input type='text' name='effectDateStart"+rowID+"' id='effectDateStart"+rowID+"' class='required' value='${firstDay}' style='width:106px;' onclick=\"WdatePicker({minDate:'#F{$dp.$D(\\'firstDay\\')}',dateFmt: 'yyyyMMdd'})\" /></td>";

var newDeleteButton = newTR.insertCell(4);
newDeleteButton.innerHTML = "<td width='130' align='center'><a href='javascript:;' onclick=\"DeleteSignRow('SignItem" + rowID + "')\">删除</a></td>";

var newNameButton = newTR.insertCell(5);
newNameButton.innerHTML = "<td><input type='hidden' name='rowsName' value='"+ rowID +"'/></td>"
document.getElementById("txtTRLastIndex").value=parseInt(txtTRLastIndex.value)+1;

}
function DeleteSignRow(rowid) {
var signFrame = findObj("SignFrame", document);
var signItem = findObj(rowid, document);
//获取将要删除的行的Index
var rowIndex = signItem.rowIndex;
//删除指定Index的行
signFrame.deleteRow(rowIndex);

}

function resetAll() {
$("input[type=text],select",navTab.getCurrentPanel()).each(function(){
$(this).val('');
});
}
</script>
<div class="pageContent">
<form method="post" action="FrPsamRange/saveFrPsamRangeBatchAction?rel=FrPsamRangeNext&navTabId=FrPsamRangeNext&callbackType=closeCurrent" class="pageForm required-validate" onsubmit="return validateCallback(this,navTabAjaxDone);">
<div class="pageHeader">
<div class="searchBar">
<ul class="searchContent">
<li>
<label>下级代理商</label>
<input type="hidden" name="agentId" />
<input type="text" name="name" class="required" style="width:106px;" maxlength="19" readonly="true"/>
<a class="btnLook" href="PmoAgent/nextAgentLookUp" lookupGroup="">查找</a>
</li>

<li>
<label>停用时间</label>
<input type="text" name="stopUsed" id="stopUsed" value="2099-12-31" class="required" readonly="true"/>
</li>
</ul>
<input type="hidden" name="firstDay" id="firstDay" value="${firstDay }"/>
<input name="txtTRLastIndex" type="hidden" id="txtTRLastIndex" value="1" />
</div>
</div>
<div class="pageFormContent" layoutH="56">
<table id="SignFrame" class="genericTbl" width="100%" layoutH="188">
<thead>
<tr>
<th width="130" align="center">号段起始</th>

<th width="130" align="center">号段终止</th>

<th width="130" align="center">启用时间</th>

<th width="130" align="center">生效时间</th>
</tr>
</thead>
<tbody>
<tr>
<td width="130" align="center"><input type="hidden" /></td>

<td width="130" align="center"><input type="hidden" /></td>

<td width="130" align="center"><input type="hidden" /></td>

<td width="130" align="center"><input type="hidden" /></td>
</tr>

</tbody>
</table>

<input type="button" value="新增行" onClick="AddSignRow();" />
<input type="submit" value="提交" />

</div>
</form>
</div>

后台代码：

**
* @throws ParseException
* @Title: saveFrPsamRangeBatch
* @Description: TODO(批量新增)
* @param @return 设定文件
* @return ModelAndView 返回类型
* @throws
* LV
*/
@RequestMapping(value="/saveFrPsamRangeBatchAction",method = RequestMethod.POST)
public ModelAndView saveFrPsamRangeBatch(FrPsamRange model,HttpServletRequest request,String agentId,String name) throws ParseException{
String userName = super.getSessionKey(request, ApplicationContextKey.KEY_USER_LOGIN_NAME).toString();
String agentID = super.getSessionKey(request, ApplicationContextKey.KEY_AGENT_ID).toString();
System.out.println("agentID"+agentID);
String agentName = super.getSessionKey(request, ApplicationContextKey.KEY_AGENT_NAME).toString();
String rows[] = request.getParameterValues("rowsName");
List<FrPsamRange> frPsamRangeList = new ArrayList<FrPsamRange>();
List<FrPsamRange> errorList = new ArrayList<FrPsamRange>();
SimpleDateFormat sdf=new SimpleDateFormat("yyyy-MM-dd");
//从页面中接收批量新增的内容
for(int i = 1; i < rows.length; i++) {
FrPsamRange frPsamRange = new FrPsamRange();
String startPsamId = request.getParameter("StartPsamId"+rows[i]);
String endPsamId = request.getParameter("EndPsamId"+rows[i]);
String startUsed = request.getParameter("startUsed"+rows[i]);
String effectDateStart = request.getParameter("effectDateStart"+rows[i]);
frPsamRange.setStartPsamId(startPsamId);
frPsamRange.setEndPsamId(endPsamId);
frPsamRange.setStartUsed(sdf.parse(startUsed));
frPsamRange.setStopUsed(sdf.parse("2099-12-31"));
frPsamRange.setEffectDateStart(effectDateStart);
frPsamRange.setAgentId(new BigDecimal(agentId));
frPsamRange.setAgentName(name);
frPsamRangeList.add(frPsamRange);
}
}
前段动态新增的数据都存储在frPsamRangeList中

更多相关文章

随机推荐