码迷,mamicode.com
首页 > 数据库 > 详细

省市二级联动(连接数据库)

时间:2015-02-02 13:57:17      阅读:223      评论:0      收藏:0      [点我收藏+]

标签:

技术分享

根据省选择市名称。

1、省份用的struts标签<s:select>后台把省信息存到list里面

  后台代码

    this.provinceList=provincesDefineService.findAllProvinces();

2、前台用list接收,代码:

    <tr>
              <td style="width:120px">省名称</td>
              <td style="width:120px"><s:select id="prnId" name="prnId" list="provinceList" listKey="prnId" 
                listValue="prnName"  headerKey="" headerValue="--请选择省份--"
                label="城市信息" onchange="selprn()"></s:select></td>
                           </tr>
          <tr>
              <td style="width:120px">城市名称</td>
              <td style="width:120px">
              <select id="cityId" name="cityId" >

               <option selected="selected" >--请选择城市--</option>

             </select>
                           </tr>


3、在省信息的select标签定义onchange()方法

  js代码

function selprn(){
    var _prn=document.getElementById("prnId");
        $.ajax({
            type:"post",
            url:"../zone!findcity.action",
            datatype : "json",
            data: {pronviceId:_prn.value},
            success : function(data){
                var city=eval(data);
                for(var i=0;i<city.length;i++){
                  $(‘#cityId‘).append("<option value=‘"+city[i].cityid+"‘>"+city[i].cityname+"</option>");
                 
                } 
                $(‘#cityId option:eq(0)‘).attr("selected","selected")
            }
        
        });
    }

4、在action里面根据省信息查找该省下的城市然后返回json,在前台接收,append到城市下拉框下面

  action代码

public void findcity() throws UnsupportedEncodingException{
        request.setCharacterEncoding("UTF-8");
        List<Object[]> list = null;
        Provinces Provinces=provincesDefineService.findById(pronviceId);
        String prnname=Provinces.getPrnName();
        list = citiesDefineService.findbyprn(prnname);
        JSONArray json=new JSONArray();
        for (int i=0;i<list.size();i++){
            JSONObject obj=new JSONObject();
            obj.put("cityid", list.get(i)[2]);
            obj.put("cityname", list.get(i)[1]);
            json.add(obj);
        } 
        try {
            System.out.println(json.toString());
            reponse.setContentType("text/plain; charset=utf-8");
            reponse.getWriter().write(json.toString());
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

 

省市二级联动(连接数据库)

标签:

原文地址:http://www.cnblogs.com/beicheng/p/4267477.html

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