zoukankan      html  css  js  c++  java
  • AJAX级联做下拉框

    js页面代码

    <form action="<%=realPath2 %>/searchServlet" method="post">
    <div >
    <select class="input-text" id="floor" name="floor"
    style=" 200px">
    <option value="">-------请选择楼盘-------</option>
    <c:forEach var="Floor" items="${Floor}">
    <option value="${Floor.fname}">${Floor.fname}</option>
    </c:forEach>
    </select>

    <select class="input-text" id="machine" name="machine"
    style=" 200px">
    </select>
    <button type="submit" class="btn btn-success radius" id="" name="" >
    搜索商品
    </button>
    </div>
    </form>

    AJAX方法

    $(function() {
    $("#floor").mouseleave(
    function() {
    // alert("dfghjkl");
    var floor = $("#floor").val();
    $.ajax({
    url : "${pageContext.request.contextPath}/SelectCommodityServlet",
    type : "POST",
    dataType : "json",
    data : {
    floor : floor,
    },
    success : function(data) {
    if (data.aidd == true) {
    $('#machine').empty();
    $('#machine').append("<option value="">-------请选择机器-------</option>");
    jQuery.each(data.list, function(i,item){
    $('#machine').append("<option value="+ item.mname+">"+ item.mname+"</option>");
    });
    return false;
    } else {
    return;
                        }
                   },
                });

            });

    });

    servlet代码

    public void doGet(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {
    response.setCharacterEncoding("utf-8");
    String fname = request.getParameter("floor");
    FloorDao dao = new FloorDaoImpl();
    boolean aidd = false;
    try {
    MachineDao mdao = new MachineDaoImpl();
    FloorBean sp = dao.selectFloorByName(fname);
    List<MachineBean> list=null;
    if(sp!=null){
    aidd = true;
    list = mdao.selectMachineByFid(sp.getId());
    }
    else{
    aidd = false;
    }
    JSONObject json = new JSONObject();
    json.put("aidd", aidd);
    json.put("list", list);
    PrintWriter out = response.getWriter();
    out.println(json.toString());
    out.close();
    } catch (Exception e) {
    // TODO Auto-generated catch block
    e.printStackTrace();
    }
    }

  • 相关阅读:
    CentOS 7 安装 MariaDB
    yum工具使用 -- 配置自定义yum源
    CentOS 7 安装 redis
    CentOS 7 安装Python3 + 虚拟环境 + django
    Linux 安装 Python3.6.5
    CentOS 7 安装Python3 虚拟环境
    oracle数据库分页原理
    POI工具类
    IoDH单例模式
    为什么使用单例模式【转】
  • 原文地址:https://www.cnblogs.com/ll0405/p/8268777.html
Copyright © 2011-2022 走看看