基于JSP Servlet xml的select二级联动

---

Servlet：queryJointDevice.java

package com;

import java.io.*;  
import javax.servlet.*;
import javax.servlet.ServletConfig;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


import java.sql.*;  
import java.util.*;

public class queryJointDevice extends HttpServlet {

    public queryJointDevice() {
        super();
    }
    public void destroy() {
        super.destroy(); 
    }
    private static final long serialVersionUID = 1L;

    private String driver;
    private String url;
    private String user;
    private String pass;
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        System.out.println("get方法进入...");
        //response.setContentType("text/html");
        //request.setCharacterEncoding("utf-8");
        //response.setCharacterEncoding("utf-8");
        String q=request.getParameter("q"); 
        System.out.println(q);       
        if("TraAntExchage".equals(q)){
        try{    
                System.out.println(q);
                Connection con=null;
                Statement stat=null;
                ResultSet rs = null;
                Class.forName("com.microsoft.sqlserver.jdbc.SQLServerDriver");
                String url = "jdbc:sqlserver://localhost:1433;DatabaseName=DEVICEINFO";
                String user = "sa";
                String password = "123456"; 
                System.out.println("数据URL："+url);
                System.out.println("数据库登录名："+user);
                System.out.println("数据库密码："+password);
                con = DriverManager.getConnection(url,user,password);
                stat = con.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);
                String sql="select * from TB_TraAntExchage";
                System.out.println("123");
                rs=stat.executeQuery(sql);
                System.out.println("456");
                rs.last();//获取记录总数
                int j=rs.getRow();
                String[] TAExchage_NAME=new String[j];
                System.out.println(rs.getRow());
                int i=0;
                //rs.first();
                rs.absolute(0);

                response.setContentType("text/xml"); 
                response.setCharacterEncoding("UTF-8"); 
                request.setCharacterEncoding("UTF-8"); 
                response.setHeader("Cache-Control", "no-cache");
                PrintWriter out = response.getWriter(); 
                String xml_head="<?xml version=\"1.0\" encoding=\"UTF-8\"?>";
                String xml_start = "<selects>"; 
                String xml_end = "</selects>"; 
                String xml = ""; 
                while(rs.next()){
                    System.out.println(rs.getString("TAExchage_NAME"));
                    TAExchage_NAME[i]=rs.getString("TAExchage_NAME");
                    i++;
                    System.out.println("789");
                    System.out.println(rs.getString("TAExchage_NAME"));
                    System.out.println("11");
                    xml += "<select><value>"+rs.getString("TAExchage_NAME")+"</value><text>"+rs.getString("TAExchage_NAME")+"</text></select>"; 

                }
                String last_xml = xml_head+xml_start + xml + xml_end; 
                System.out.println(last_xml);
                response.getWriter().write(last_xml); 
                out.flush(); 
                out.close();
                con.close();
        } 
        catch (Exception ex) {          
            System.out.println("数据库加载失败");
            System.out.println(ex);
        }        
        }
        if(q=="发信机"){

        }
    }

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

    @Override
    public void init(ServletConfig config)
        throws ServletException
    {
        super.init(config);
        //配置文件配置的数据库驱动、url、数据库登录名、登录密码
        ServletConfig conf = getServletConfig();
        driver = conf.getInitParameter("driver");
        url = conf.getInitParameter("url");
        user = conf.getInitParameter("user");
        pass = conf.getInitParameter("pass");
        System.out.println("数据库驱动："+driver);
        System.out.println("数据URL："+url);
        System.out.println("数据库登录名："+user);
        System.out.println("数据库密码："+pass);
    }

}

---

JSP：getSub.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
      <script type="text/javascript">
      function selectJointDevice(str){
            var xmlhttp;
            if (str==""){
                document.getElementById("TAExchage_NAME").innerHTML="";
                return;
            }
            if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
            else{// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange=function() {
                  if (xmlhttp.readyState==4 && xmlhttp.status==200){
                        document.getElementById("test2").innerHTML="processResponse1";
                        document.getElementById("test2").innerHTML="aaa";
                        var xmlDoc = xmlhttp.responseXML.documentElement;//获得返回的XML文档 
                        var xSel = xmlDoc.getElementsByTagName("select"); 
                        //获得XML文档中的所有<select>标记 
                        var select_root = document.getElementById("test"); 
                        //获得网页中的第二个下拉框 
                        select_root.options.length=0; 
                        //每次获得新的数据的时候先把每二个下拉框架的长度清0 
                        var aaa = document.createTextNode(xSel.length);
                        document.getElementById("test2").appendChild(aaa);
                        var textNode = document.createTextNode(xSel[1].getElementsByTagName("value")[0].firstChild.data);
                        document.getElementById("test2").appendChild(textNode);
                        //document.write("1123456");
                        //document.write(xSel.childNodes[0].firstChild.nodeValue);
                        for(var i=0;i<xSel.length;i++){ 
                              //var xValue = xSel.childNodes[0].firstChild.nodeValue;
                              var xValue = xSel[i].getElementsByTagName("value")[0].firstChild.data;
                              //获得每个<select>标记中的第一个标记的值,也就是<value>标记的值 
                             // var xText = xSel.childNodes[1].firstChild.nodeValue; 
                              var xText= xSel[i].getElementsByTagName("text")[0].firstChild.data;
                              //获得每个<select>标记中的第二个标记的值,也就是<text>标记的值 

                              var option = new Option(xText, xValue); 
                              //根据每组value和text标记的值创建一个option对象 

                              try{ 
                                select_root.add(option);//将option对象添加到第二个下拉框中 
                              }
                              catch(e){ 
                                  document.write(e);
                              } 
                        } 

                    }
            }
            xmlhttp.open("GET","queryJointDevice?q="+str,true);
            xmlhttp.send();}
        </script>
  </head>

  <body>
    <select style="heigt:32px;font-size:16px;margin:0px;"  name="JOINT_DEVICETYPE" onchange="selectJointDevice(this.value)">
        <option selected="selected">==请选择==</option>
        <option value="TraAntExchage" >发信天线交换设备</option>
        <option value="发信移相交换设备" >发信移相交换设备</option>
    </select>

    <select style="heigt:32px;font-size:16px;margin:0px;"  name="JOINT_DEVICENAME" id="test" >
        <option selected="selected" >==请选择==</option>
    </select>

    <div id="test2" style="height:100px;width:100px;background:blue;'"> 
    </div>
  </body>
</html>