第一種方式：
javabean:
1 public class BusLoanInfoShop {
2 private Integer id;
3 private Integer bid;
4 private String shopName;
5 private String platformName;
6 private String shopLevel;
7 private String operatingPeriod;
8 private String shopOwner;
9 private String subAccount;
10 private String sbuPassword;
11 private String businessOpera;
12 private String businessAddress;
13 private String warehouseAddress;
14 private String salesIncome;
15 private String totalLiability;
16 private String bankLiabilities;
17 private String netProfit;
18
19 public Integer getId() {
20 return id;
21 }
22 public void setId(Integer id) {
23 this.id = id;
24 }
25 public Integer getBid() {
26 return bid;
27 }
28 public void setBid(Integer bid) {
29 this.bid = bid;
30 }
31 public String getShopName(){
32 return this.shopName;
33 }
34 public void setShopName(String shopName){
35 this.shopName=shopName;
36 }
37 public String getPlatformName(){
38 return this.platformName;
39 }
40 public void setPlatformName(String platformName){
41 this.platformName=platformName;
42 }
43 public String getShopLevel(){
44 return this.shopLevel;
45 }
46 public void setShopLevel(String shopLevel){
47 this.shopLevel=shopLevel;
48 }
49 public String getOperatingPeriod(){
50 return this.operatingPeriod;
51 }
52 public void setOperatingPeriod(String operatingPeriod){
53 this.operatingPeriod=operatingPeriod;
54 }
55 public String getShopOwner(){
56 return this.shopOwner;
57 }
58 public void setShopOwner(String shopOwner){
59 this.shopOwner=shopOwner;
60 }
61 public String getSubAccount(){
62 return this.subAccount;
63 }
64 public void setSubAccount(String subAccount){
65 this.subAccount=subAccount;
66 }
67 public String getSbuPassword(){
68 return this.sbuPassword;
69 }
70 public void setSbuPassword(String sbuPassword){
71 this.sbuPassword=sbuPassword;
72 }
73 public String getBusinessOpera(){
74 return this.businessOpera;
75 }
76 public void setBusinessOpera(String businessOpera){
77 this.businessOpera=businessOpera;
78 }
79 public String getBusinessAddress(){
80 return this.businessAddress;
81 }
82 public void setBusinessAddress(String businessAddress){
83 this.businessAddress=businessAddress;
84 }
85 public String getWarehouseAddress(){
86 return this.warehouseAddress;
87 }
88 public void setWarehouseAddress(String warehouseAddress){
89 this.warehouseAddress=warehouseAddress;
90 }
91 public String getSalesIncome(){
92 return this.salesIncome;
93 }
94 public void setSalesIncome(String salesIncome){
95 this.salesIncome=salesIncome;
96 }
97 public String getTotalLiability(){
98 return this.totalLiability;
99 }
100 public void setTotalLiability(String totalLiability){
101 this.totalLiability=totalLiability;
102 }
103 public String getBankLiabilities(){
104 return this.bankLiabilities;
105 }
106 public void setBankLiabilities(String bankLiabilities){
107 this.bankLiabilities=bankLiabilities;
108 }
109 public String getNetProfit(){
110 return this.netProfit;
111 }
112 public void setNetProfit(String netProfit){
113 this.netProfit=netProfit;
114 }
115
116 }
javabean
ListForm:
1 public class ShopListForm {
2 private List<BusLoanInfoShop> shop;
3
4 public List<BusLoanInfoShop> getShop() {
5 return shop;
6 }
7
8 public void setShop(List<BusLoanInfoShop> shop) {
9 this.shop = shop;
10 }
11
12
13
14 }
ListForm
spring Mvc控制器入口：
1 @RequestMapping("/save")
2 public void save(ShopListForm shopForm,HttpServletResponse response) throws Exception{
3 for(BusLoanInfoShop shop:shopForm.getShop()){
4 System.out.println("shop.name="+shop.getShopName());
5 }
6
7 }
spring mvc訪問入口
html代碼：
1 <div id="optionContainer" class="ftitle">經驗實體信息(必填，多個網商店鋪需加行)</div> 2 <div class="fitem"> 3 <table id="tblShopData"> 4 <tr> 5 <td>網店名稱</td> 6 <td>電商平台名稱</td> 7 <td>網店級別（僅限淘寶及天貓商戶）</td> 8 <td>網店持續經營年限</td> 9 <td>網店實際所有者（個人名稱或公司名稱)</td> 10 <td>子帳號</td> 11 <td>密碼</td> 12 <td>主要產品、品牌</td> 13 <td>經營地址</td> 14 <td>倉庫地址</td> 15 <td>上年度銷售</td> 16 <td>總負債</td> 17 <td>銀行負債</td> 18 <td>上年度淨利潤</td> 19 </tr> 20 <tr id="tShopRow0"> 21 <td> 22 <input id="shop[0].shopName" class="easyui-validatebox" name="shop[0].shopName" data-options="required:true,validType:'length[1,200]'"> 23 </td> 24 <td> 25 <input id="shop[0].platformName" class="easyui-validatebox" name="shop[0].platformName" data-options="required:true,validType:'length[1,200]'"> 26 </td> 27 <td> 28 <input id="shop[0].shopLevel" class="easyui-validatebox" name="shop[0].shopLevel" data-options="required:true,validType:'length[1,100]'"> 29 </td> 30 <td> 31 <input id="shop[0].operatingPeriod0" class="easyui-validatebox" name="shop[0].operatingPeriod" data-options="required:true,validType:'length[1,100]'"> 32 </td> 33 <td> 34 <input id="shop[0].shopOwner" class="easyui-validatebox" name="shop[0].shopOwner" data-options="required:true,validType:'length[1,200]'"> 35 </td> 36 <td> 37 <input id="shop[0].subAccount" class="easyui-validatebox" name="shop[0].subAccount" data-options="required:true,validType:'length[1,100]'"> 38 </td> 39 <td> 40 <input id="shop[0].sbuPassword" class="easyui-validatebox" name="shop[0].sbuPassword" data-options="required:true,validType:'length[1,100]'"> 41 </td> 42 <td> 43 <input id="shop[0].businessOpera" class="easyui-validatebox" name="shop[0].businessOpera" data-options="required:true,validType:'length[1,300]'"> 44 </td> 45 <td> 46 <input id="shop[0].businessAddress" class="easyui-validatebox" name="shop[0].businessAddress" data-options="required:true,validType:'length[1,300]'"> 47 </td> 48 <td> 49 <input id="shop[0].warehouseAddress" class="easyui-validatebox" name="shop[0].warehouseAddress" data-options="required:true,validType:'length[1,300]'"> 50 </td> 51 52 <td> 53 <input id="shop[0].salesIncome" class="easyui-validatebox" name="shop[0].salesIncome0" data-options="required:true,validType:'length[1,100]'"> 54 </td> 55 <td> 56 <input id="shop[0].totalLiability" class="easyui-validatebox" name="shop[0].totalLiability" data-options="required:true,validType:'length[1,100]'"> 57 </td> 58 <td> 59 <input id="shop[0].bankLiabilities" class="easyui-validatebox" name="shop[0].bankLiabilities" data-options="required:true,validType:'length[1,100]'"> 60 </td> 61 <td> 62 <input id="shop[0].netProfit" class="easyui-validatebox" name="shop[0].netProfit" data-options="required:true,validType:'length[1,100]'"> 63 </td> 64 65 </tr> 66 </table> 67 <br /> 68 <div > 69 <a href="#" onclick="addShopRow()">添加一行</a> 70 <a href="#" onclick="delShopRow()">刪除一行</a> 71 </div> 72 </div>html
js代碼：
1 //添加行
2 function addShopRow(){
3 var num=$("#rowCount").val();//取值
4 num=parseInt(num);
5 num++;
6 $("#tShopRow0").clone(true).attr("id","tShopRow"+num).appendTo("#tblShopData");
7 $("#tShopRow"+num+" td").each(function(){
8 $(this).find("input[type='text']").val("");//清空數據
9 $(this).find("input[name='shop[0].shopName']").attr("id","shop['"+num+"'].shopName").attr("name","shop['"+num+"'].shopName");
10 $(this).find("input[name='shop[0].platformName']").attr("id","shop['"+num+"'].platformName").attr("name","shop['"+num+"'].platformName");
11 $(this).find("input[name='shop[0].shopLevel']").attr("id","shop['"+num+"'].shopLevel").attr("name","shop['"+num+"'].shopLevel");
12 $(this).find("input[name='shop[0].operatingPeriod']").attr("id","shop['"+num+"'].operatingPeriod").attr("name","shop['"+num+"'].operatingPeriod");
13 $(this).find("input[name='shop[0].shopOwner']").attr("id","shop['"+num+"'].shopOwner").attr("name","shop['"+num+"'].shopOwner");
14 $(this).find("input[name='shop[0].subAccount']").attr("id","shop['"+num+"'].subAccount").attr("name","shop['"+num+"'].subAccount");
15 $(this).find("input[name='shop[0].sbuPassword']").attr("id","shop['"+num+"'].sbuPassword").attr("name","shop['"+num+"'].sbuPassword");
16 $(this).find("input[name='shop[0].businessOpera']").attr("id","shop['"+num+"'].businessOpera").attr("name","shop['"+num+"'].businessOpera");
17 $(this).find("input[name='shop[0].businessAddress']").attr("id","shop['"+num+"'].businessAddress").attr("name","shop['"+num+"'].businessAddress");
18 $(this).find("input[name='shop[0].warehouseAddress']").attr("id","shop['"+num+"'].warehouseAddress").attr("name","shop['"+num+"'].warehouseAddress");
19 $(this).find("input[name='shop[0].salesIncome']").attr("id","shop['"+num+"'].salesIncome").attr("name","shop['"+num+"'].salesIncome");
20 $(this).find("input[name='shop[0].totalLiability']").attr("id","shop['"+num+"'].totalLiability").attr("name","shop['"+num+"'].totalLiability");
21 $(this).find("input[name='shop[0].bankLiabilities']").attr("id","shop['"+num+"'].bankLiabilities").attr("name","shop['"+num+"'].bankLiabilities");
22 $(this).find("input[name='shop[0].netProfit']").attr("id","shop['"+num+"'].netProfit").attr("name","shop['"+num+"'].netProfit");
23 });
24 $('#rowCount').val(num);//重新賦值
25 }
26 //刪除行
27 function delShopRow(){
28 var num=$("#rowCount").val();//取值
29 num=parseInt(num);
30 if(num>0){
31 $("#tShopRow"+num).remove();
32 num--;
33 $('#rowCount').val(num);//重新賦值
34 }else{
35 alert("這是第一行了！");
36 }
37
38 }
javaScript
第二種方式：
spring Mvc控制器入口：
1 public void save(HttpServletRequest request,HttpServletResponse response) throws Exception{
2 BusLoanInfoGuaranter busLoanInfoGuaranter=new BusLoanInfoGuaranter();
3 busLoanInfoGuaranter.setBid(busLoanInfo.getId());
4 busLoanInfoGuaranter.setGuaranterName(request.getParameter("guaranterName"+i));
5 busLoanInfoGuaranter.setGuaranterCard(request.getParameter("guaranterCard"+i));
6 busLoanInfoGuaranter.setGuaranterEmployer(request.getParameter("guaranterEmployer"+i));
7 busLoanInfoGuaranter.setGuaranterDuties(request.getParameter("guaranterDuties"+i));
8 busLoanInfoGuaranter.setGuaranterPhone(request.getParameter("guaranterPhone"+i));
9 busLoanInfoGuaranter.setGuaranterMaritalStatus(request.getParameter("guaranterMaritalStatus"+i));
10 busLoanInfoGuaranter.setGuaranterHouseAddress(request.getParameter("guaranterHouseAddress"+i));
11 busLoanInfoGuaranter.setGuaranterMonthlyIncome(request.getParameter("guaranterMonthlyIncome"+i));
12 busLoanInfoGuaranter.setGuaranterValues(request.getParameter("guaranterValues"+i));
13 busLoanInfoGuaranter.setGuaranterTotalLiabilities(request.getParameter("guaranterTotalLiabilities"+i));
14 }
spring Mvc訪問入口
htm代碼：
1 <div class="ftitle">是否提供自然人保證，是就填寫下面信息</div> 2 <div class="fitem"> 3 <label class="ui-label">是否提供自然人保證：</label><select class="easyui-combobox" name="ifGuaranter" > 4 <option value=""></option> 5 <option value="是">是</option> 6 <option value="否">否</option> 7 </select> 8 </div> 9 10 <div class="ftitle">保證人信息</div> 11 <div class="fitem"> 12 <table id="tblData"> 13 <tr> 14 <td>保證人姓名</td> 15 <td>證件號碼</td> 16 <td>工作單位</td> 17 <td>職務</td> 18 <td>聯系電話</td> 19 <td>婚姻狀況</td> 20 <td>家庭地址</td> 21 <td>月收入情況</td> 22 <td>資產總額</td> 23 <td>負債總額</td> 24 </tr> 25 <tr id="tRow0"> 26 <td> 27 <input type="text" id="guaranterName0" name="guaranterName0" > 28 </td> 29 <td> 30 <input type="text" id="guaranterCard0" name="guaranterCard0" > 31 </td> 32 <td> 33 <input type="text" id="guaranterEmployer0" name="guaranterEmployer0" > 34 </td> 35 <td> 36 <input type="text" id="guaranterDuties0" name="guaranterDuties0" > 37 </td> 38 <td> 39 <input type="text" id="guaranterPhone0" name="guaranterPhone0" > 40 </td> 41 <td> 42 <select id="guaranterMaritalStatus0" name="guaranterMaritalStatus0" > 43 <option value=""></option> 44 <option value="已婚">已婚</option> 45 <option value="未婚">未婚</option> 46 <option value="離異">離異</option> 47 <option value="喪偶">喪偶</option> 48 <option value="其他">其他</option> 49 </select> 50 </td> 51 <td> 52 <input type="text" id="guaranterHouseAddress0" name="guaranterHouseAddress0" > 53 </td> 54 <td> 55 <input type="text" id="guaranterMonthlyIncome0" name="guaranterMonthlyIncome0" > 56 </td> 57 <td> 58 <input type="text" id="guaranterValues0" name="guaranterValues0" > 59 </td> 60 <td> 61 <input type="text" id="guaranterTotalLiabilities0" name="guaranterTotalLiabilities0" > 62 </td> 63 </tr> 64 </table> 65 <br /> 66 <div > 67 <a href="#" onclick="addGuaranterRow()">添加一行</a> 68 <a href="#" onclick="delGuaranterRow()">刪除一行</a> 69 </div> 70 71 </div>html
js代碼：
1 //保證人添加行
2 function addGuaranterRow(){
3 var num=$("#guaranterRowCount").val();
4 num=parseInt(num);
5 num++;//點擊自加
6 $("#tRow0").clone(true).attr("id","tRow"+num).appendTo("#tblData");
7 $("#tRow"+num+" td").each(function(){
8 $(this).find("input[type='text']").val("");//清空數據
9 $(this).find("input[name='guaranterName0']").attr("id","guaranterName"+num).attr("name","guaranterName"+num);
10 $(this).find("input[name='guaranterCard0']").attr("id","guaranterCard"+num).attr("name","guaranterCard"+num);
11 $(this).find("input[name='guaranterEmployer0']").attr("id","guaranterEmployer"+num).attr("name","guaranterEmployer"+num);
12 $(this).find("input[name='guaranterDuties0']").attr("id","guaranterDuties"+num).attr("name","guaranterDuties"+num);
13 $(this).find("input[name='guaranterPhone0']").attr("id","guaranterPhone"+num).attr("name","guaranterPhone"+num);
14 $(this).find("input[name='guaranterMaritalStatus0']").attr("id","guaranterMaritalStatus"+num).attr("name","guaranterMaritalStatus"+num);
15 $(this).find("input[name='guaranterHouseAddress0']").attr("id","guaranterHouseAddress"+num).attr("name","guaranterHouseAddress"+num);
16 $(this).find("input[name='guaranterMonthlyIncome0']").attr("id","guaranterMonthlyIncome"+num).attr("name","guaranterMonthlyIncome"+num);
17 $(this).find("input[name='guaranterValues0']").attr("id","guaranterValues"+num).attr("name","guaranterValues"+num);
18 $(this).find("input[name='guaranterTotalLiabilities0']").attr("id","guaranterTotalLiabilities"+num).attr("name","guaranterTotalLiabilities"+num);
19 });
20 $("#guaranterRowCount").val(num);//重新賦值
21 }
22 //保證人刪除行
23 function delGuaranterRow(){
24 var num=$("#guaranterRowCount").val();
25 num=parseInt(num);
26 if(num>0){//判斷是不是第一行
27 $("#tRow"+num).remove();
28 num--;//刪除後要自減
29 $('#guaranterRowCount').val(num);//重新賦值
30 }else{
31 alert("這是第一行了！");
32 }
33 }
javascript
完，備忘用。
