<select> 联动 ajax

jwen

浏览: 63213 次
性别:

最近访客更多访客>>

lijun0349

hjk9317

凋叶丶棕

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

java

Ajax Servlet XML SQL Server SQL

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<%@ page language="java" import="java.util.*,java.lang.*" contentType="text/html; charset=GBK" pageEncoding="GBK"%>

<HTML>
<HEAD>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<meta http-equiv="Content-Type" content="text/xml;charset=GBK"/>
<META name="GENERATOR" content="IBM WebSphere Page Designer V3.5 for Windows">
<META http-equiv="Content-Style-Type" content="text/css">
<LINK rel="stylesheet" href="/doc/theme/normal.css">
<script Language="JavaScript" src="/doc/checkjs/timein.js"></script>
<script language="JavaScript" src="/doc/checkjs/check.js"></script>
<script language="javascript">

function addList(){

var thelist=document.form1.leftlist;
var theText=document.form1.theText.value;
var theValue=document.form1.theValue.value;

var theOption=new Option(theText,theValue);
var thePostion=thelist.options.length;
   thelist.options[thePostion] =theOption;

}
function movlist(a,b){

var folist=document. form1.elements[a];
var tolist=document. form1.elements[b];
var theNum= folist.options.selectedIndex;

while(theNum>=0){

var theText=folist.options[theNum].text;
var theValue=folist.options[theNum].value;
var newOption=new Option(theText,theValue);
var theNum2=tolist.options.length;

tolist.options[theNum2]=newOption;

folist.options[theNum]=null;
theNum=folist.options.selectedIndex;

}

}
function delLlis(){

    var theForm=document.form1;

var formNum1=theForm.leftlist.options.selectedIndex;
   if(formNum1>=0){
theForm.leftlist.options[formNum1]=null;

}

var formNum2=theForm.rightlist.options.selectedIndex;
if(formNum2>=0){
theForm.rightlist.options[formNum2]=null;
}
}
        var req;
        window.onload=function(){
        }

        function Change_Select()
        {
            var type=document.getElementById('DocumentType').value;
            var url="/doc/servlet/SelectServlet?type="+escape(type);
            if(window.XMLHttpRequest)
            {
                req=new XMLHttpRequest();
            }else if(window.ActiveXObject)
            {
                req=new ActiveXObject("Microsoft.XMLHTTP");
            }

            if(req)
            {
                req.open("GET",url,true);
                req.onreadystatechange=callback;
                req.send(null);
            }
        }

        function callback()
        {
            if(req.readyState == 4)
            {
                if(req.status == 200)
                {
                    parseMessage();
                }else{
                    alert("Not able to retrieve description"+req.statusText);
                }
            }
        }

        function parseMessage()
        {
            var xmlDoc=req.responseXML.documentElement;
            var xSel=xmlDoc.getElementsByTagName('select');
            var select_root=document.getElementById('skill');
            select_root.options.length=0;

            for(var i=0;i<xSel.length;i++)
            {
                var xValue=xSel[i].childNodes[0].firstChild.nodeValue;
                var xText=xSel[i].childNodes[1].firstChild.nodeValue;
                var option=new Option(xText,xValue);
                try{
                    select_root.add(option);
                }catch(e){
                }
            }
        }
</script>

<jsp:useBean id="dataBean" scope="request" class="initBean.BaseBean" />

<jsp:useBean id="uiBean" scope="request" class="initBean.PageBean" />
</HEAD>
<body>
<form name="form1" method="POST">
<br>
<TABLE width="353" border="0" align="center">
<tr>
<td width="309" colspan="2" align="left">
选择视图：
<SELECT fieldflag='Y' width="153" name='DocumentType' onChange="Change_Select()">
<OPTION value=>
</OPTION>
<OPTION value=wsView>
文书视图
</OPTION>
<OPTION value=kjView>
科技视图
</OPTION>
<OPTION value=zpView>
照片视图
</OPTION>
<OPTION value=htView>
合同视图
</OPTION>
</SELECT>
</td>
</tr>
</TABLE>
<table width="353" border="0" align="center">
<tr>
<td height=25 colspan=3>选择字段：(按住ctrl键可多选)</td>
</tr>
<tr>
<td width=119>
<select name="leftlist" id='skill' size="10" style="WIDTH: 119px;color:#666666" multiple="MULTIPLE">
</SELECT>
    </td>
<td width=65 align=center>
<input name="Submit2" type="button" value="添加 >>" onclick="movlist('leftlist','rightlist')" /><BR><BR>
<input name="Submit3" type="button" value="<< 删除" onClick="movlist('rightlist','leftlist')" />
</td>
<td width=119><select name="rightlist" size="10" multiple="multiple" style="WIDTH: 119px;color:#666666"></SELECT> </td>
</tr>
<tr>
<td colspan="3" align="center">
<input class=btn type="button" name="B1" value="确定" onClick="commit(0)">
</tr>
</tr>
</table>
<input type="hidden" name="fieldnames">
</form>
<script language="JavaScript">
function commit(flag)
{
if(check('ok'))
{
window.document.form1.fieldnames.value="";
for (var i=0;i<window.document.form1.length;i++)
{
if(window.document.form1.item(i).fieldflag=="Y")
{
var temp1=window.document.form1.item(i).value;
temp1=YMYTrim(temp1);
if(temp1.length!=0)
{
window.document.form1.fieldnames.value=window.document.form1.fieldnames.value+","+window.document.form1.item(i).name;
window.document.form1.item(i).value=temp1;
}
}
}
var temp2=window.document.form1.fieldnames.value;
temp2=temp2.substring(1);
window.document.form1.fieldnames.value=temp2;
if(flag==0)
document.all.form1.action="/doc/servlet/system_data.viewWS";
document.all.form1.submit();
}
}
</script>
</body>
</html>

package system_data;

import java.io.IOException;
import java.sql.SQLException;
import java.util.Vector;

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

import initBean.BaseBean;

public class SelectServlet extends HttpServlet {

    /**
     * Constructor of the object.
     */
    public SelectServlet() {
        super();
    }

    /**
     * Destruction of the servlet. <br>
     */
    public void destroy() {
        super.destroy(); // Just puts "destroy" string in log
        // Put your code here
    }

    /**
     * The doGet method of the servlet. <br>
     *
     * This method is called when a form has its tag value method equals to get.
     *
     * @param request the request send by the client to the server
     * @param response the response send by the server to the client
     * @throws ServletException if an error occurred
     * @throws IOException if an error occurred
     */
    public void doGet(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        //response.setContentType("text/xml");
        //response.setHeader("Cache-Control","no-cache");
		response.setHeader("Cache-Control", "no-cache");
		response.setContentType("text/xml;charset=GBK");
//		response.setCharacterEncoding(arg0)
		response.setCharacterEncoding("GBK");
        BaseBean basebean = new BaseBean();
        String viewType=request.getParameter("type").toString();
        System.out.println(viewType);
        try {
        	String Sql="SELECT EN_NAME,CH_NAME FROM TABINFO WHERE viewType="+"'"+viewType+"'"+" and flag='0'";
			int count = basebean.queryRecordMulti(Sql,2);
			Vector vec = null;
			Vector vecItem = null;
	        String xml_start="<?xml version=\"1.0\" encoding=\"gb2312\"?>"+"<selects>";
	        String xml_end="</selects>";
	        String xml="";
		    vec = basebean.getRecords();
		    System.out.println(vec.size());
		    for(int i=0;i<vec.size();i++){
		    	vecItem=(Vector)vec.elementAt(i);
		    	String s1=((String)vecItem.elementAt(0)).trim();
		    	String s2=((String)vecItem.elementAt(1)).trim();
		    	if(i<2){
		    		xml="<select><value>"+s2+"</value><text>"+s1+"</text></select>";
		    	}else{
		    		xml +="<select><value>"+s2+"</value><text>"+s1+"</text></select>";
		    	}
		    }
		   // out.println("<?xml version=\"1.0\" encoding=\"gb2312\"?>");
		    String last_xml=xml_start+xml+xml_end;
	        response.getWriter().write(last_xml);
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} catch (SQLException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} catch (ClassNotFoundException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
    }

    /**
     * The doPost method of the servlet. <br>
     *
     * This method is called when a form has its tag value method equals to post.
     *
     * @param request the request send by the client to the server
     * @param response the response send by the server to the client
     * @throws ServletException if an error occurred
     * @throws IOException if an error occurred
     */
    public void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {

        doGet(request,response);
    }

    /**
     * Initialization of the servlet. <br>
     *
     * @throws ServletException if an error occure
     */
    public void init() throws ServletException {
        // Put your code here
    }

}

分享到：

用javascript的正则表达式来验证Email地址 ... | 按指定的字符把字符串分割为字符串数组

2007-03-12 15:55
浏览 5043
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论