省市二级联动（连接数据库）

浏览数：20 / 时间：2015年06月12日

技术分享

根据省选择市名称。

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();
        }
    }