你的位置:首页 > Java教程

[Java教程]动态数据与后台交互的两种方式


第一种方式:

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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" 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" style="width:59px" data-options="required:true,validType:'length[1,100]'">63                    </td>64                    65                  </tr>66                </table>67                <br />68               <div style="text-align:center;"> 69                  <a href="#" onclick="addShopRow()">添加一行</a> 70                  &nbsp;&nbsp;<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" style="width:139px"> 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" style="width:89px">28                    </td>29                    <td>30                    <input type="text" id="guaranterCard0" name="guaranterCard0" style="width:89px">31                    </td>32                    <td>33                    <input type="text" id="guaranterEmployer0" name="guaranterEmployer0" style="width:89px">34                    </td>35                    <td>36                    <input type="text" id="guaranterDuties0" name="guaranterDuties0" style="width:89px">37                    </td>38                    <td>39                    <input type="text" id="guaranterPhone0" name="guaranterPhone0" style="width:89px">40                    </td>41                    <td>42                    <select id="guaranterMaritalStatus0" name="guaranterMaritalStatus0" style="width:89px">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" style="width:89px">53                    </td>54                    <td>55                      <input type="text" id="guaranterMonthlyIncome0" name="guaranterMonthlyIncome0" style="width:89px">56                    </td>57                    <td>58                      <input type="text" id="guaranterValues0" name="guaranterValues0" style="width:89px">59                    </td>60                    <td>61                      <input  type="text" id="guaranterTotalLiabilities0" name="guaranterTotalLiabilities0" style="width:89px">62                    </td>63                  </tr>64                </table>65                <br />66               <div style="text-align:center;"> 67                  <a href="#" onclick="addGuaranterRow()">添加一行</a>68                  &nbsp;&nbsp;<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

完,备忘用。