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

根据省选择市名称。

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();
        }
    }
时间: 2024-07-30 19:43:22

省市二级联动(连接数据库)的相关文章

JS实现省市二级联动

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF

JavaScript省市二级联动

cities.xml <?xml version="1.0" encoding="GB2312"?> <china> <province name="吉林省"> <city>长春</city> <city>吉林市</city> <city>四平</city> <city>松原</city> <city>通

省市二级联动--使用app-jquery-cityselect.js插件

只有省市二级联动,三级联动还没处理好,会尽快完善. 嵌入id: <div class="form-group"> <label>地址</label> <p>从:</p> <div class="input-group"> <input id="areaIdFrom" name="areaIdFrom" type="hidden"

jsp+ajax+serverlet实现省市二级联动

jsp界面 <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&g

(转)JavaScript html js 地区二级联动,省市二级联动,省市县js+xml三级联动

JavaScript html js 地区二级联动,省市二级联动,省市县js+xml三级联动 原文链接:http://heisetoufa.iteye.com/blog/353974 比较好的二级联动: 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 2 <HTML> 3 <HEAD> 4 <TITLE> New Document </TITLE>

JavaScript实现省市二级联动

    JavaScript实现省市二级联动 展示一下效果? 当我鼠标点击前面的省那一栏的时候后面市那一栏会出现相对应的下辖市 实现思路 1. 添加相对应的select容器 2. 然后添加数据 3. 将相应的数据赋值给对应的option控件 方法的讲解 Function()函数 onchange();改变事件 笔者在这里写了一个关于河南与河北的简单联动   省市联动 <body> <select id="province"></select>省 &l

微信小程序picker组件 - 省市二级联动

微信小程序picker组件自带省市区选择器,但是业务需求需要省市选择器,参考官方demo自己写了一个省市选择器 wxml文件 <view class="section"> <view class="section__title">省市二级联动demo</view> <picker mode="multiSelector" bindchange="bindMultiPickerChange&quo

js省市二级联动实例

//动态创建省市二级联动<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><select id="province" onchange="func1(this)"> </sele

jQuery_完成省市二级联动

当填表的时候会让你设计某省某市怎么设计,应该明白,如果你选择了一个确定的省,那么在第二个下拉框内则不会有除了你选择的省的市之外的名称.而这功能用js来实现很麻烦,但是用jq确很容易实现. 原表结构: 代码如下: <!DOCTYPE html> <html> <head> <script typr="text/javascript" src="js/jquery-1.8.3.js"></script> <

JS——省市二级联动

1.核心代码: <script> var cities = new Array(11); cities[0] = new Array("东城区","西城区" ,"崇文区", "宣武区" ,"朝阳区" ,"丰台区","石景山区" ,"海淀区门" ,"头沟区"); cities[1] = new Array(); cit