成功网管必备素质硬件篇
2006-10-30 16:48
816 查看
今天抽时间写了一个关于级联菜单demo 可以实现多级级联，现已经打包供大家下载学习，自己写了一个简单的组件用来处理下拉列表框及联问题，在解析js脚本中的 parseXml(xmlDom)含糊还存在一些不足，处理同名的下拉列表框（根据生成的xml文件的index属性来处理），我会尽快完善，并会增加其他的功能，
希望这个设计对大家有所帮助，如果大家有好的想法，就请指正，谢谢！
java 代码
源码1：
package duzn.soa;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
public class SOAData {
private StringBuffer sb = new StringBuffer();
private String objName = "";
public String getXmlDoc(){
return sb.toString();
}
public void beginSelectOptions(String objName){
this.objName = objName;
sb.append("<?xml version=\"1.0\" encoding=\"GB2312\"?>");
sb.append("<root>");
sb.append("<" + objName + " type=\"select\">");
}
public void beginSelectOptions(String objName, int index){
this.objName = objName;
sb.append("<?xml version=\"1.0\" encoding=\"GB2312\"?>");
sb.append("<root>" + "\n");
sb.append("<" + objName + " type=\"select\" index=\"" + index + "\">");
}
public void addSelectOption(String objContent, String objValue){
sb.append("<option value=\"" + objValue + "\">");
sb.append(objContent + "</option>");
}
public void endSelectOptions(){
sb.append("</" + this.objName + ">");
sb.append("</root>");
}
public void soaWrite(HttpServletResponse response){
//设置输出的信息的格式及字符集
response.setContentType("text/xml; charset=GB2312");
response.setHeader("Cache-Control","no-cache");
try {
PrintWriter pw = response.getWriter();
pw.println(getXmlDoc());
pw.flush();
pw.close();
} catch (IOException e) {
e.printStackTrace();
}
}
/*public static void main(String[] args){
SOAData soaData = new SOAData();
soaData.beginSelectOptions("dept");
soaData.addSelectOption("gdys", "1");
soaData.addSelectOption("dzgc", "2");
soaData.addSelectOption("jjgl", "3");
soaData.endSelectOptions();
System.out.println(soaData.getXmlDoc());
}*/
}
java 代码
package duzn.soa;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class SelectServlet extends HttpServlet{
@Override
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String fieldName = request.getParameter("fieldName");
int branchId = 0;
try {
branchId = Integer.parseInt(request.getParameter("branchId"));
} catch (NumberFormatException e) {
branchId = 1;
System.out.println(e.getMessage());
}
SOAData soaData = new SOAData();
soaData.beginSelectOptions(fieldName);
soaData.addSelectOption("--请选择--", "0");
//在此根据branchId操作数据库查询数据
if(branchId == 1){
soaData.addSelectOption("办公室", "1");
soaData.addSelectOption("财务处", "2");
soaData.addSelectOption("党工办", "3");
}else if(branchId == 2){
soaData.addSelectOption("计算机系", "1");
soaData.addSelectOption("经管系", "2");
soaData.addSelectOption("电子系", "3");
}
soaData.endSelectOptions();
System.out.println(soaData.getXmlDoc());
soaData.soaWrite(response);
}
}
xml 代码 web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4"
xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<servlet>
<servlet-name>SelectServlet</servlet-name>
<servlet-class>duzn.soa.SelectServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>SelectServlet</servlet-name>
<url-pattern>/select.do</url-pattern>
</servlet-mapping>
</web-app>
js 代码 xmlhttp.js
var xmlreq = false; //创建一个XMLHttpRequest对象
function newXMLHttpRequest() {
if (window.XMLHttpRequest) {
xmlreq = new XMLHttpRequest(); // 在非Microsoft浏览器中创建XMLHttpRequest对象
} else if (window.ActiveXObject) {
try { //通过MS ActiveX创建XMLHttpRequest
xmlreq = new ActiveXObject("Msxml2.XMLHTTP"); // 尝试按新版InternetExplorer方法创建
} catch (e1) {
try { // 创建请求的ActiveX对象失败
xmlreq = new ActiveXObject("Microsoft.XMLHTTP"); // 尝试按老版InternetExplorer方法创建
} catch (e2) {
// 不能通过ActiveX创建XMLHttpRequest
}
}
}
}
//发送请求函数-->业务流程
function sendXml(url, param){
if(url.length == 0){
return;
}else{
if( param == null || param == "undefined" ){
param = "";
}
newXMLHttpRequest();
try{
xmlreq.onreadystatechange=proce; //指定响应的函数 proce()
xmlreq.open("GET", url, true); //以GET方式传输数据，打开url，以异步方式
xmlreq.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlreq.send(param); //发送请求
}catch(exception){
alert("您要访问的资源不存在!");
}
}
}
//回调函数
function proce(){
if(xmlreq.readyState == 4){ //对象状态
if(xmlreq.status == 200 || xmlreq.status == 0){ //信息已成功返回，开始处理信息;
//alert(xmlreq.responseText);
parseXml(xmlreq.responseXML);
}else{
window.alert("所请求的页面有异常");
alert(xmlreq.statusText);
}
}
}
//解析xml文档
function parseXml(xmlDom){
var rootNode = xmlDom.documentElement;
if(rootNode == null){
return false;
}else{
for(var node = rootNode.firstChild; node != null; node=node.nextSibling){
var objName = node.nodeName;
var type = node.getAttribute("type");
if(type == "select"){
clearSelectOption(objName);
var opts = node.getElementsByTagName("option");
for(var i=0; i<opts.length; i++){
var optName = opts[i].firstChild.data;
var optValue = opts[i].getAttribute("value");
addSelectOption(objName, optValue, optName);
}
}
}
}
}
//往下拉列表框中写数据
function addSelectOption(objName, optValue, optName){
var elmtObj = document.getElementById(objName);
elmtObj.options[elmtObj.length] = new Option(optName, optValue);
}
//清空下拉列表框
function clearSelectOption(objName){
var elmtObj = document.getElementById(objName);
while(elmtObj.options.length > 0){
elmtObj.remove(0);
}
//elmtObj.options.length = 0;
}
function sendText(url, param){
if(url.length == 0){
return;
}else{
if( param == null || param == "undefined" ){
param = "";
}
newXMLHttpRequest();
try{
xmlreq.onreadystatechange=getText; //指定响应的函数 getText()
xmlreq.open("GET", url, true); //以GET方式传输数据，打开url，以异步方式
xmlreq.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlreq.send(param); //发送请求
}catch(exception){
alert("您要访问的资源不存在!");
}
}
}
function getText(){
if(xmlreq.readyState == 4){ //对象状态
if(xmlreq.status == 200 || xmlreq.status == 0){ //信息已成功返回，开始处理信息;
alert(xmlreq.responseText);
}else{
window.alert("所请求的页面有异常");
alert(xmlreq.statusText);
}
}
}
jsp代码 index.jsp
<%@ page contentType="text/html; charset=GB2312" pageEncoding="GB2312"%>
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script lang="javascript" src="xmlhttp.js"></script>
<script>
function branchChange(branchId){
sendXml('select.do?fieldName=dept&branchId='+branchId, '');
}
</script>
</HEAD>
<BODY>
<div id="nn"></div>
<form name="form1" method="post" action="">
机构
<select name="branch" onchange="branchChange(this.value)">
<option value='0'>--请选择--</option>
<option value='1'>行政机关</option>
<option value='2'>教学管理</option>
</select>
部门
<select name="dept"><option value="0">--请选择--</option></select>
</BODY>
</HTML>
希望这个设计对大家有所帮助，如果大家有好的想法，就请指正，谢谢！
java 代码
源码1：
package duzn.soa;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
public class SOAData {
private StringBuffer sb = new StringBuffer();
private String objName = "";
public String getXmlDoc(){
return sb.toString();
}
public void beginSelectOptions(String objName){
this.objName = objName;
sb.append("<?xml version=\"1.0\" encoding=\"GB2312\"?>");
sb.append("<root>");
sb.append("<" + objName + " type=\"select\">");
}
public void beginSelectOptions(String objName, int index){
this.objName = objName;
sb.append("<?xml version=\"1.0\" encoding=\"GB2312\"?>");
sb.append("<root>" + "\n");
sb.append("<" + objName + " type=\"select\" index=\"" + index + "\">");
}
public void addSelectOption(String objContent, String objValue){
sb.append("<option value=\"" + objValue + "\">");
sb.append(objContent + "</option>");
}
public void endSelectOptions(){
sb.append("</" + this.objName + ">");
sb.append("</root>");
}
public void soaWrite(HttpServletResponse response){
//设置输出的信息的格式及字符集
response.setContentType("text/xml; charset=GB2312");
response.setHeader("Cache-Control","no-cache");
try {
PrintWriter pw = response.getWriter();
pw.println(getXmlDoc());
pw.flush();
pw.close();
} catch (IOException e) {
e.printStackTrace();
}
}
/*public static void main(String[] args){
SOAData soaData = new SOAData();
soaData.beginSelectOptions("dept");
soaData.addSelectOption("gdys", "1");
soaData.addSelectOption("dzgc", "2");
soaData.addSelectOption("jjgl", "3");
soaData.endSelectOptions();
System.out.println(soaData.getXmlDoc());
}*/
}
java 代码
package duzn.soa;
import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class SelectServlet extends HttpServlet{
@Override
protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String fieldName = request.getParameter("fieldName");
int branchId = 0;
try {
branchId = Integer.parseInt(request.getParameter("branchId"));
} catch (NumberFormatException e) {
branchId = 1;
System.out.println(e.getMessage());
}
SOAData soaData = new SOAData();
soaData.beginSelectOptions(fieldName);
soaData.addSelectOption("--请选择--", "0");
//在此根据branchId操作数据库查询数据
if(branchId == 1){
soaData.addSelectOption("办公室", "1");
soaData.addSelectOption("财务处", "2");
soaData.addSelectOption("党工办", "3");
}else if(branchId == 2){
soaData.addSelectOption("计算机系", "1");
soaData.addSelectOption("经管系", "2");
soaData.addSelectOption("电子系", "3");
}
soaData.endSelectOptions();
System.out.println(soaData.getXmlDoc());
soaData.soaWrite(response);
}
}
xml 代码 web.xml
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4"
xmlns="http://java.sun.com/xml/ns/j2ee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee
http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
<servlet>
<servlet-name>SelectServlet</servlet-name>
<servlet-class>duzn.soa.SelectServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>SelectServlet</servlet-name>
<url-pattern>/select.do</url-pattern>
</servlet-mapping>
</web-app>
js 代码 xmlhttp.js
var xmlreq = false; //创建一个XMLHttpRequest对象
function newXMLHttpRequest() {
if (window.XMLHttpRequest) {
xmlreq = new XMLHttpRequest(); // 在非Microsoft浏览器中创建XMLHttpRequest对象
} else if (window.ActiveXObject) {
try { //通过MS ActiveX创建XMLHttpRequest
xmlreq = new ActiveXObject("Msxml2.XMLHTTP"); // 尝试按新版InternetExplorer方法创建
} catch (e1) {
try { // 创建请求的ActiveX对象失败
xmlreq = new ActiveXObject("Microsoft.XMLHTTP"); // 尝试按老版InternetExplorer方法创建
} catch (e2) {
// 不能通过ActiveX创建XMLHttpRequest
}
}
}
}
//发送请求函数-->业务流程
function sendXml(url, param){
if(url.length == 0){
return;
}else{
if( param == null || param == "undefined" ){
param = "";
}
newXMLHttpRequest();
try{
xmlreq.onreadystatechange=proce; //指定响应的函数 proce()
xmlreq.open("GET", url, true); //以GET方式传输数据，打开url，以异步方式
xmlreq.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlreq.send(param); //发送请求
}catch(exception){
alert("您要访问的资源不存在!");
}
}
}
//回调函数
function proce(){
if(xmlreq.readyState == 4){ //对象状态
if(xmlreq.status == 200 || xmlreq.status == 0){ //信息已成功返回，开始处理信息;
//alert(xmlreq.responseText);
parseXml(xmlreq.responseXML);
}else{
window.alert("所请求的页面有异常");
alert(xmlreq.statusText);
}
}
}
//解析xml文档
function parseXml(xmlDom){
var rootNode = xmlDom.documentElement;
if(rootNode == null){
return false;
}else{
for(var node = rootNode.firstChild; node != null; node=node.nextSibling){
var objName = node.nodeName;
var type = node.getAttribute("type");
if(type == "select"){
clearSelectOption(objName);
var opts = node.getElementsByTagName("option");
for(var i=0; i<opts.length; i++){
var optName = opts[i].firstChild.data;
var optValue = opts[i].getAttribute("value");
addSelectOption(objName, optValue, optName);
}
}
}
}
}
//往下拉列表框中写数据
function addSelectOption(objName, optValue, optName){
var elmtObj = document.getElementById(objName);
elmtObj.options[elmtObj.length] = new Option(optName, optValue);
}
//清空下拉列表框
function clearSelectOption(objName){
var elmtObj = document.getElementById(objName);
while(elmtObj.options.length > 0){
elmtObj.remove(0);
}
//elmtObj.options.length = 0;
}
function sendText(url, param){
if(url.length == 0){
return;
}else{
if( param == null || param == "undefined" ){
param = "";
}
newXMLHttpRequest();
try{
xmlreq.onreadystatechange=getText; //指定响应的函数 getText()
xmlreq.open("GET", url, true); //以GET方式传输数据，打开url，以异步方式
xmlreq.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlreq.send(param); //发送请求
}catch(exception){
alert("您要访问的资源不存在!");
}
}
}
function getText(){
if(xmlreq.readyState == 4){ //对象状态
if(xmlreq.status == 200 || xmlreq.status == 0){ //信息已成功返回，开始处理信息;
alert(xmlreq.responseText);
}else{
window.alert("所请求的页面有异常");
alert(xmlreq.statusText);
}
}
}
jsp代码 index.jsp
<%@ page contentType="text/html; charset=GB2312" pageEncoding="GB2312"%>
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<script lang="javascript" src="xmlhttp.js"></script>
<script>
function branchChange(branchId){
sendXml('select.do?fieldName=dept&branchId='+branchId, '');
}
</script>
</HEAD>
<BODY>
<div id="nn"></div>
<form name="form1" method="post" action="">
机构
<select name="branch" onchange="branchChange(this.value)">
<option value='0'>--请选择--</option>
<option value='1'>行政机关</option>
<option value='2'>教学管理</option>
</select>
部门
<select name="dept"><option value="0">--请选择--</option></select>
</BODY>
</HTML>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 