省市区三级联动以及初始化

$(function () {//省市区三级的初始化
    var province_code = "${merchant.merprovince}";
    if (province_code != null && province_code != "")
        selectCity1();

    var mercity = "${merchant.mercity}";
    if (mercity != null && mercity != "")
        selectDistrict1();
});
//获取城市列表
function selectCity1() {
    var province_code = $("#merprovince").val();
    $.ajax({
        type: 'post',
        url: '/merchant/getAreaCode',
        async: false,
        dataType: 'json',
        data: {'p_area_code': province_code},
        success: function (data) {
            var innerHtml = "<option value='' >--请选择城市--</option>";
            var list = data.arealist;
            for (var i = 0; i < list.length; i++) {
                if (list[i].area_code =="${merchant.mercity}")
                    innerHtml += "<option value='" + list[i].area_code + "' selected=selected >" + list[i].name + "</option>";
                else
                    innerHtml += "<option value='" + list[i].area_code + "'  >" + list[i].name + "</option>";
            }
            $("#mercity").html(innerHtml);
        }
    });
}

//获取区县列表
function selectDistrict1() {
    var mercity ="${merchant.mercity}";
    var city_code = $("#mercity").val();
    if (city_code == null || city_code == "") {
        city_code = mercity
    }
    var city_code1 = $("#mercity").val();
    if (city_code1 == "") {
        alert("请选区/县");
        return;
    }
    $.ajax({
        type: 'post',
        url: '/merchant/getAreaCode',/*如果查询的表不一样,则请求路径应该和上面的查询路径不一致*/
        async: false,
        dataType: 'json',
        data: {'p_area_code': city_code},
        success: function (data) {
            var innerHtml = "<option value='' >--请选择区/县--</option>";
            var list = data.arealist;
            for (var i = 0; i < list.length; i++) {
                if (list[i].area_code =="${merchant.merarea}") {
                    innerHtml += "<option value='" + list[i].area_code + "' selected=selected >" + list[i].name + "</option>";
                } else
                    innerHtml += "<option value='" + list[i].area_code + "'>" + list[i].name + "</option>";
            }
            $("#merarea").html(innerHtml);
        }
    });
}
<dl>
    <dt>省</dt>
    <dd>
        <select name="merprovince" id="merprovince" class="required" onchange="selectCity1()">
            <option value="">--请选择省--</option>
            <c:forEach var="province" items="${merproList}">
                <option value="${province.provinceNo}"   
                    <c:if test="${merchant.merprovince==province.provinceNo}"> selected="selected"</c:if>
                >${province.provinceName}</option>
            </c:forEach>
        </select>
        <font color="red">*</font>
    </dd>
</dl>

<dl>
    <dt>市</dt>
    <dd>
        <select name="mercity" id="mercity" class="required" onchange="selectDistrict1() "></select>
        <font color="red">*</font>
    </dd>
</dl>

<dl>
    <dt>区</dt>
    <dd>
        <select name="merarea" id="merarea" class="required"></select>
        <font color="red">*</font>
    </dd>
</dl>

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值