一个页面实现修改删除列表显示，ajax动态生成table(使用ajax，springmvc，jsp)

先看效果：

 

点击保存使用ajax保存当前表数据，返回一个table格式的html，替换掉页面上的table（已添加的教育经历）。

JSP主要代码：

 

<div class="container"  style="width: 100%;">
		<div class="row mg15">
			<div class="mainbox_C_C">
				<div class="setupBox">
	      			<div class="setItems">
	      				<div class="setFold setUnfold" rel="base">
	              			<h2>教育经历</h2>
	            		</div>
            			<div class="setItemsInfo">
							<div id="personal_education" >
								<h6 style="color: #191919;font-size: 100%;font-weight: bold;">已添加的教育经历：</h6>
								<div id="data-table-education" class="data-table">
									<table>
										<thead>
											<tr>
												<th data-property='beginDate'>开始时间</th>
												<th data-property='endDate'>结束时间</th>
												<th data-property='school'>学校</th>
												<th data-property='major'>专业</th>
												<th data-property='description'>描述</th>
												<th class='data-action'>操作</th>
											</tr>
										</thead>
										<c:forEach items="${educations }" var="eh" varStatus="status">
										<tr id="${eh.objectId }">
											<td>${fn:substringBefore(eh.beginDate, ' ')}</td>
											<td>${fn:substringBefore(eh.endDate, ' ')}</td>
											<td>${eh.school }</td>
											<td>${eh.major }</td>
											<td>${eh.description }</td>
											<td>
												<a class='action-delete' title='删除' href='${dynamicDomain}/member/deleteTr/1/${eh.objectId }'></a>
												<a class='action-update' title='更新' href='#'></a>
											</td>
										</tr>
										</c:forEach>
									</table>
								</div>
								<h6 style="color: #191919;font-size: 100%;font-weight: bold;">教育经历</h6>

								<form action="${dynamicDomain}/member/savePersonalEH" method="post" accept-charset="utf-8" class="horizontal-form validator_form" id="personal_education_form">
									<div class="a_info_form">
										<input type="hidden" id="userId" name="userId" value="${user.objectId }"/>
										<div class="input-group" >
								        	<label for="beginDate">开始时间<span>*</span></label>
									        <div class="inputs">
									        	<input type="text" id="beginDate" name="beginDate" class="a_input_width2" readonly="readonly" onClick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'endDate\')}',readOnly:true})" />    
									      		<span class="input-error"><div id="beginDateTip"></div></span>
									        </div>
										</div>
								      	<div class="input-group" >
									        <label for="endDate">结束时间<span>*</span></label>
									        <div class="inputs">
									        	<input type="text" id="endDate" name="endDate" class="a_input_width2" readonly="readonly" onClick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'beginDate\')}',readOnly:true})" />    
												 <span class="input-error"><div id="endDateTip"></div></span>
											</div>
									    </div>
								      	<div class="input-group" >
									        <label for="school">学校<span>*</span></label>
									        <div class="inputs">
										         <input id="school" name="school&