java学习

java学习

 

ajax下拉框联动

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>My JSP 'car.jsp' starting page</title>
  </head>
 
  <body>
    <select id="car" onchange="sendAjax()">
        <option>-- 请选择汽车品牌 --</option>
        <option value="bmw">宝马</option>
        <option value="audi">奥迪</option>
        <option value="benz">奔驰</option>
    </select>
    <select id="type" onchange="sendType()">
        <option>-- 请选择系列 --</option>
    </select>
    <script type="text/javascript">
            var xmlHttp;
        
        /*创建XMLHttpRequest对象*/
        function createXMLHttpRequest() {
            if(window.ActiveXObject) {
                  //IE
                  xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
              } else {
                  //chrome firefox opera
                  xmlHttp = new XMLHttpRequest();
              }
        }
        
        function sendAjax(){
            createXMLHttpRequest();
            
            var name = document.getElementById("car").value;
            xmlHttp.onreadystatechange = callback;//回调函数
            
            
            xmlHttp.open("GET","car.jspx?name="+name,true);
            xmlHttp.send();
            
        }
        
        function callback() {
            if(xmlHttp.readyState == 4) {
                if(xmlHttp.status == 200) {
                    var xml = xmlHttp.responseXML;
                    
                    var types = xml.getElementsByTagName("recode");
                    document.getElementById("type").options.length = 1;
                    for(var i = 0;i < types.length;i++) {
                        
                        //alert(types[i].childNodes[0].nodeValue);
                        var myOption = new Option(types[i].childNodes[0].nodeValue,types[i].childNodes[0].nodeValue);
                        document.getElementById("type").options.add(myOption);
                        
                    }
                    
                } else {
                    alert("Ajax Error1!");
                }
            }
        }
        function sendType(){
                createXMLHttpRequest();
            
            var name = document.getElementById("type").value;
            xmlHttp.onreadystatechange = callback2;//回调函数
            
            
            xmlHttp.open("GET","ajax.jspx?name="+name,true);
            xmlHttp.send();
        }
            function callback2() {
            if(xmlHttp.readyState == 4) {
                if(xmlHttp.status == 200) {
                    var result = xmlHttp.responseText;
                    
                     alert(result);
                        
                    }
                    
                } else {
                    alert("Ajax Error2!");
                }
            }
        
    </script>
  </body>
</html>
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


public class CarServlet extends HttpServlet {

    
    /**
     *
     */
    private static final long serialVersionUID = 1L;

    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        //DB取出数据
        Map<String, List<String>> data = new HashMap<String, List<String>>();
        List<String> bmwList = new ArrayList<String>();
        bmwList.add("521");
        bmwList.add("621");
        bmwList.add("721");
        bmwList.add("821");
        bmwList.add("X6");
        
        
        List<String> audiList = new ArrayList<String>();
        audiList.add("A1");
        audiList.add("A2");
        audiList.add("A3");
        audiList.add("A4");
        audiList.add("A5");
        audiList.add("A6");
        audiList.add("A8");
        
        List<String> benzList = new ArrayList<String>();
        benzList.add("B1");
        benzList.add("B2");
        benzList.add("B3");
        benzList.add("B4");
        benzList.add("B5");
        
        data.put("bmw", bmwList);
        data.put("audi", audiList);
        data.put("benz", benzList);
        //----------------------------------------------------------
        
        
        
        String name = request.getParameter("name");
        
        List<String> dataList = data.get(name);
        
        
        response.setContentType("text/xml;charset=UTF-8");
        PrintWriter out = response.getWriter();
        
        out.print("<?xml version=\"1.0\" encoding=\"UTF-8\"?>");
        out.print("<data>");
        for(String str : dataList) {
            out.print("<recode>"+str+"</recode>");
        }
        out.print("</data>");
        
        out.flush();
        out.close();
        
    }


    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        doGet( request,  response);
    }

}



import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class AjaxServlet extends HttpServlet {

    private static final long serialVersionUID = 1L;

    @Override
    protected void service(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        
        
        
        System.out.println("method:" + request.getMethod());
        String name = request.getParameter("name");
        System.out.println("Hello! " + name);
        
        response.setContentType("text/html");
        PrintWriter out = response.getWriter();
    /*    if("tom".equals(name)) {
            out.print("error");
        } else {
            out.print("ok");
        }*/
        
        out.print(name);
        out.flush();
        out.close();
    }
    
}

posted on 2013-06-17 10:10 杨军威 阅读(300) 评论(0)  编辑  收藏


只有注册用户登录后才能发表评论。


网站导航:
 

导航

统计

常用链接

留言簿

随笔档案

搜索

最新评论

阅读排行榜

评论排行榜