ssm框架下总行、省、市、分行级联

1.html代码:
         <form>
              <div class="form-group">
                 <label for="recipient-name" class="control-label">收款人开户银行:</label>
                 <select style="width:170px;" id="bank" onchange="getDropBranchVal();"></select>
              </div>
              
              <div class="form-group">
                 <label for="recipient-name" class="control-label">收款人银行归属地(省):</label>
                 <select style="width:185px;" id="bankProvince" onchange="getCityDropVal();"></select>
              </div>
              <div class="form-group">
                <label for="recipient-name" class="control-label">收款人银行归属地(市区):</label>
                <select style="width:170px;" id="bankCity" onchange="getDropBranchVal();"></select>
              </div>
              <div class="form-group">
                <label for="recipient-name" class="control-label">收款人开户银行名称:</label>
                <select style="width:170px;" id="bankBranch"></select>
              </div>    
		  </form>
2、js代码:
  <#--获取省下拉框-->  
           function getProvinceDropVal(){
        
              $.ajax({
                type : 'post',               
                url : '${basePath}/system/getProvinceDropVal.shtml', // 请求路径
                cache : false,
                async :false,
                data : { 
                
                },
                success : function(result) {      
                    <#--初始化下拉框的值-->
                     $("#bankProvince").append("<option value='0'>-</option>");
                    var tmpArr = JSON.parse(result.provinceList);
                    for (var i = 0; i < tmpArr.length; i++) {
                        $("#bankProvince").append(
                                "<option value='" + tmpArr[i].id + "'>" + tmpArr[i].name + "</option>");
                    }
                    $("#bankProvince option:first").prop("selected", 'selected');
                },
                error : function(data) {
                    alert("异常!");
                }
            });              
          }       
		  
  <#--获取市下拉框-->  
           function getCityDropVal(){
               $("#bankCity").empty();
                var  bankProvince =$('#bankProvince').val(); 
              $.ajax({
                type : 'post',               
                url : '${basePath}/system/getCityDropVal.shtml', // 请求路径
                cache : false,
                async :false,
                data : { 
                'provinceId':bankProvince
                },
                success : function(result) {      
                    <#--初始化下拉框的值-->
                     $("#bankCity").append("<option value='0'>-</option>");
                    var tmpArr = JSON.parse(result.cityList);
                    for (var i = 0; i < tmpArr.length; i++) {
                        $("#bankCity").append(
                                "<option value='" + tmpArr[i].id + "'>" + tmpArr[i].name + "</option>");
                    }
                    $("#bankCity option:first").prop("selected", 'selected');
                },
                error : function(data) {
                    alert("异常!");
                }
            });              
          }      
		  
    <#--获取银行所在地框--> 
           function getDropBranchVal(){
           $('#bankBranch').empty();
           var bankProvince =$('#bankProvince').val(); 
           var bankCity =$('#bankCity').val(); 
           var bank=$('#bank').val(); 
              $.ajax({
                type : 'post',               
                url : '${basePath}/bank/getDropBranchVal.shtml', // 请求路径
                cache : false,
                async :false,
                data : { 
                'provinceId':bankProvince,
                'cityId':bankCity,
                'bankId':bank
                },
                success : function(result) {      
                    <#--初始化下拉框的值-->
                     $("#bankBranch").append("<option value='0'>-</option>");
                    var tmpArr = JSON.parse(result.dropCbBankBranchList);
                    for (var i = 0; i < tmpArr.length; i++) {
                        $("#bankBranch").append(
                                "<option value='" + tmpArr[i].id + "'>" + tmpArr[i].name + "</option>");
                    }
                    $("#bankBranch option:first").prop("selected", 'selected');
                },
                error : function(data) {
                    alert("请选择地区或银行名!");
                }
            });              
          }        		  
		  
	3、数据库
	
	   (1)总行表:id  bankCardName   bankCode subId
                  1	 中国工商银行	  ICBC	  111
	   (2)支行表:id               name                                provinceid cityid bankid
		        80739  中国工商银行股份有限公司北京通州支行新华分理处	   1	     1  	1
	   (3)省表:  id    name
                  1	    北京
	   (4)市表: id  name    provinceid   areacode
	             1	北京市	     1	        010
	   (5)区表: id  cityid    name       PostCode
 			      1	  1	      东城区	  100010
				 
		逻辑关联:区表关联市表id,市表关联省表id,支行关联省、市、总行id
		
   4、后台
       (1)数据源1(省): 无传参查询省表,返回全国所有省的List
       (2)数据源2(市):传入省id查询市表,返回传入省的所有市的List
       (3)数据源3(总行):无传参查询总行表,返回全国总行List
       (4)数据源4(支行):传入省id、市id查询支行表,返回某个总行在某个省下的某个市的所有支行List	   

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值