码迷,mamicode.com
首页 > 其他好文 > 详细

动态数据与后台交互的两种方式

时间:2016-11-12 22:30:13      阅读:275      评论:0      收藏:0      [点我收藏+]

标签:gpe   app   public   duti   idt   https   response   find   art   

第一种方式:

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

完,备忘用。

动态数据与后台交互的两种方式

标签:gpe   app   public   duti   idt   https   response   find   art   

原文地址:http://www.cnblogs.com/xuanaiwu/p/6057383.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!