zoukankan      html  css  js  c++  java
  • jquery json实现省市级级联

    java后台程序:

    import java.util.HashMap;
    import java.util.List;
    import java.util.Map;

    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpSession;

    import org.apache.log4j.Logger;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RequestMethod;
    import org.springframework.web.bind.annotation.ResponseBody;

    import com.tugou.bean.TBAreaBean;
    import com.tugou.controller.BaseController;
    import com.tugou.service.AreaService;
    import com.tugou.util.StringUtil;

    import net.sf.json.JSONObject;

    /**
    * (省、市、区(县))维护Controller
    * @author zhangh
    *
    */
    @Controller
    @RequestMapping("/area")
    public class AreaController extends BaseController{

    private static final Logger logger = Logger.getLogger(AreaController.class);

    @Autowired
    private AreaService<TBAreaBean> areaService;

    /**
    * 查询所有省、市、区
    * @param request
    * @return
    */
    @RequestMapping(value = "queryAreaList", method={RequestMethod.GET,RequestMethod.POST},produces = "text/html;charset=UTF-8")
    @ResponseBody
    public String queryAreaList(HttpSession session,HttpServletRequest request){
    try{
    Map<String,Object> map = new HashMap<String,Object>();
    String id = request.getParameter("id");
    Integer iId = StringUtil.isNullOrBlank(id)?null:Integer.parseInt(id);
    map.put("id", iId);
    List<TBAreaBean> areatList = areaService.getAreaList(map);

    JSONObject jsonObj = new JSONObject();
    jsonObj.put("areaList", areatList);

    return jsonObj.toString();
    }catch(Exception e){
    e.printStackTrace();
    logger.error("程序错误:"+e.getMessage());
    return "0";
    }
    }
    }

    js程序:

    $(function(){
    AreaList(1,0);
    $("#province_id").change(function(){
    var provinceId=$("#province_id option:selected").val();
    AreaList(2,provinceId);
    $("#city_id").show();
    $("#area_id").hide();
    })
    $("#city_id").change(function(){
    var cityId=$("#city_id option:selected").val();
    AreaList(3,cityId);
    $("#area_id").show();

    })
    })

    /**
    * 获取所有的市级联动
    */
    function allArea(type,id){
    $.ajax({
    type:"post",
    url:hostpath+'/area/queryAreaList.html',
    data:{'id':id},
    success:function(data){
    var json = eval("(" + data + ")");
    if(type==1){
    areaList(json,$("#province_id"));
    }else if(type==2){
    areaList(json,$("#city_id"));
    }else if(type==3){
    areaList(json,$("#area_id"));
    }
    }
    });
    }

    function areaList(json,$city){
    var province = "<option value="">请选择</option>";
    $.each(json.areaList,function(idx,item){
    province += "<option value="+item.id+">"+item.name+"</option>";
    });

    $city.html(province);
    }

    html页面:

    <dl class="clearfix">
    <dt><span>选择所代理的地区:</span>*</dt>
    <dd>
    <select id="province_id">
    <option value="">请选择</option>
    </select>
    <select id="city_id" style="display: none;">
    <option value="">请选择</option>
    </select>
    <select id="area_id" style="display: none;">
    <option value="">请选择</option>
    </select>
    </dd>
    <dd class="warn"><span>不能为空</span></dd>
    </dl>

    省市县sql脚本:http://files.cnblogs.com/files/flywang/tb_area.zip

  • 相关阅读:
    EntityFramework优缺点
    领导者与管理者的区别
    七个对我最好的职业建议(精简版)
    The best career advice I’ve received
    Difference between Stored Procedure and Function in SQL Server
    2015年上半年一次通过 信息系统项目管理师
    Difference between WCF and Web API and WCF REST and Web Service
    What’s the difference between data mining and data warehousing?
    What is the difference between a Clustered and Non Clustered Index?
    用new创建函数的过程发生了什么
  • 原文地址:https://www.cnblogs.com/flywang/p/5109187.html
Copyright © 2011-2022 走看看