添加一行记录的示例

// js 代码示例

function addNew()
{
	var count = $('#mainTable').find('input[alt=svc_grp]').length;
	var cloneRow = $('#cloneRow').clone();
	cloneRow.find('input[alt=svc_grp]').attr('name', 'serviceGroupBean['+count+'].svc_grp');
	cloneRow.find('input[alt=svc_grp_name]').attr('name', 'serviceGroupBean['+count+'].svc_grp_name');
	cloneRow.find('select[title=origin_code]').attr('name', 'serviceGroupBean['+count+'].origin_code');
	cloneRow.find('input[alt=product_code]').attr('name', 'serviceGroupBean['+count+'].product_code');
	cloneRow.find('input[alt=remark]').attr('name', 'serviceGroupBean['+count+'].remark');
	cloneRow.removeAttr('id');
	$('#mainTable').append(cloneRow);
}

<table id="cloneTable" style="display: none;">
			<tr id="cloneRow">
				<td/>
				<td>
					<input type="hidden" alt="svc_grp">
				</td> 
				<td>
					<input type="text" class="InputTextbox" alt="svc_grp_name" maxlength="20">
				</td> 
				<td>
					<select title="origin_code" class="InputTextbox" >
						<option value=""><bean:message key="screen.m_svgs01.info.selectone"/></option>
						<logic:iterate id="originCode" name="LIST_ORIGIN_CODE">
							<option value="${originCode.id }">
								<bean:write name="originCode" property="name"/>
							</option>
						</logic:iterate>
					</select>
				</td> 
				<td>
					<input type="text" class="InputTextbox" alt="product_code" maxlength="20"/>
				</td>
				<td>
					<input type="text" class="InputTextbox" alt="remark" maxlength="20"/>
				</td> 
			</tr>
		</table>

用Jquery实现简直太方便了。

首先通过属性选择器算出当前行数的最大值，由于索引是从0开始的，所以直接将length做为新增行的索引

然后将隐藏的行克隆一下，然后编辑其name属性以向后台传值。最后将克隆编辑好的直接放在目的地的最后面。

Note：向后传值的话，就可以用对象list传，也可以用数组传，实例的中代码肯定是用对象传的

至于怎么删除新添加的一行，用jquery的remove方法和empty方法

对于索引值的维护，在每一列显示的序号，可以在显示的时候自动生成，也就是不用刻意的在删除的时候维护索引值，只要在后台判断为空的时候不插入就可以了，或者判断隐藏的id是不是存在来进行操作。

这样就可以将当行直接remove掉，不用担心索引什么的，

如果需要维护怎么办呢，探索中。

理论：

1.前台的索引不用管他，直接在后台控制索引。挨个加。

2.在前台用jquery获取所有的对象然后用each方法遍历，其参数function 可以获取对象的索引（从零开始）。将每个对象的隐藏索引值分别等于function的参数加一。