标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
- G2 X- Y9 |5 e: G' g
c pageencoding="gb2312"
1 y. R0 X6 \- A7 N
%>
+ P3 _( e2 q# V9 Z2 f
<style>
7 j$ e1 \0 S# X$ L/ O+ d
.f9{ font-size:9pt; }
A; V* G: [; {
.bgc{ background-color:#aecaf9; color: #0033ff }
, ~4 e5 C t; E) c1 p) r6 s) B
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
7 J8 E: \; `) n: R/ s4 g
border-bottom: solid 1px #4e7dc1;
. I+ R7 ?) I7 v# `( j- l; q
border-left: solid 1px #aecaf9;
$ ]5 U) F( r" N( k
border-right: solid 1px #5679bd;
+ U+ Z% N7 q5 w4 b; v- V
padding:1px;
* M8 z; E6 b- Y7 m& ?; ?/ ^
margin:0px;}
: S. \! j V9 O- P8 R. ^+ q
</style>
9 I6 A6 ^4 t8 C4 f6 T, n: ^
<script language="javascript">
: Q0 p: Z4 d, Y- \5 B: Y" F
<!--
6 s# Q9 M. ~8 m" k
function rv()
5 {3 M v6 W Y, q( E; q& d
{
* V6 R) q* E. Z+ N4 j% {. x
var val="";
6 E. v6 x+ Y9 `) Y
for(i=0;i<combo_box.list2.length;i++){
- F8 {. p+ F- R) E; Z% @& y7 `2 c
val+=","+combo_box.list2
.value;
4 K' q5 N) A4 V. q# ~
}
/ K: U, U; T1 l6 x8 q* r- t% h* t
if(val.charat(0)==","){
& T% W% H7 M: J2 G* y* I- p- n
val=val.substr(1,val.length);
2 v* X$ l; c7 P$ f; n8 Q
}
1 R5 @, h, h0 i$ a/ G% ]
opener.form1.frecname.value=val;
9 w( Z3 E4 O; n3 Q
self.close();
+ H; S$ {1 a$ z0 T& M" V2 X
}
* Q$ d: ?3 ~2 d. ~9 V& v' l
//-->
- Z* t) K0 j2 |5 {7 l2 d* e
</script>
/ I( B& {9 q8 g! d
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
' T& V: R/ W& `
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! B& b+ u$ c- U' X
<%
. t$ c n z" q# v. v4 ^7 [# k
cdatasource ds=new cdatasource(); //数据联结bean实例
% q4 ` F9 _, x' D" y& ]# l' b
java.sql.connection conn=ds.getconnection();
# Q6 z0 }& D+ W
java.sql.statement stmt=null;
' U, `' \0 {9 }# \0 L4 d
java.sql.resultset rs=null;
* f* d" ?% t) H4 X/ |
cdatacheck dc=new cdatacheck();
, E4 E4 g: r( ^. ^7 ]
%>
6 r/ K2 d/ I( H6 N# [* m
<%
& @2 y9 [) E+ ]. Q
string sqlu="select t1.fno, t1.fname, t2.fname as fdept from tuser t1 left outer join tdept t2 on t1.fdept = t2.fno order by t2.fname";
+ [' m: l% X9 r/ r* Z
stmt=conn.createstatement();
- G, i2 f6 l T2 Z
rs=stmt.executequery(sqlu);
: r/ \. v% v6 v. r+ F
%>
' ~2 Y" X/ j0 n
<script language='javascript'>
6 u+ j1 s, v( K, A
arr = new array();
5 w+ R Y/ G% w0 E
<% int temp=0;
% D8 R! m/ y0 |# e6 o: u( t' u3 k
while(rs.next())
. F* @2 m' e( M% L$ c6 J0 [( v0 ^" I1 K
{
/ m- E8 q4 s; E3 Y! I
%>
- y4 X: T: k1 A3 A
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
- s( f% n' Q0 ^! r6 c+ S
<%
& s/ l) J& c P" `9 b- S
temp = temp + 1;
P' b; O: X$ L' y# n! g
}
2 s2 X3 m$ U0 I
%>
+ G5 U. ~# d8 T. q6 s8 D0 I
temp=<%=temp%>;
& j; h7 a4 A* F5 Y2 r" W/ P
function changelocation(id){
# k; w; K4 F: G2 y4 D
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
( x& C* A' _' L- R( v) D
var i = 0;
G/ m v$ c- U3 `
document.combo_box.city.options[0]=new option('-------','');
# j+ [1 o8 l/ t3 k& p6 B n4 D
for(i=0;i<temp;i++){
" d4 [6 n3 L* T. K7 h5 u
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
q' ] k1 m# m" E: t7 e3 C/ j7 P' L
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
3 T( X) |/ o7 K! ^' n% `0 c
}
3 Q) `, B$ N z1 O) [' o5 ~
}
( A) [! Z. c5 C9 |( `
}
. z( U0 ?5 E, u" Z
</script>
2 ^3 L$ h T' h& q/ ~& b
+ A9 s0 F, X B6 l8 C/ D& @4 n' w" f# p
<form name="combo_box">
3 {( X; P- l' V+ U
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
7 V6 M+ R; k+ w/ n
<tr height="24">
- X8 g4 T0 E: w& o' L, T& ~
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
* y/ p# E: E1 U% F9 V; ~& B2 O
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
' z8 c, x7 w8 I1 @6 ?
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
' I, f W! a$ S7 Z* [; F
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
) Q3 E- I1 B; o
</tr>
/ x, k2 j9 C: |" Q, D+ o
<tr>
6 K/ Y% l1 h& U2 k9 {7 p4 r) S7 Q5 z
<td>
. _7 `2 L7 ?2 \3 v! y
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
; v2 |" Q) L2 T0 T7 o j# f
<option value="0">请选择部门 ---></option>
0 y/ @" m" j3 Y B* n5 u7 C& u. i ^
<%
5 L: T1 R' j U3 n5 l \. q: \
string sqld="select * from tdept";
& j' W V6 T* B4 b( w" N
stmt=conn.createstatement();
+ F/ r$ J, |# `/ Y+ F" j/ Q6 T9 J; @% m
rs=stmt.executequery(sqld);
7 S( w/ D! O% Y2 U
while(rs.next())
. Y8 f$ ?; ]. d) B/ ]. f) S$ L
{
% n: g3 n2 T0 t3 b* N! d
%>
0 l. l: t, Z# f) J9 c! E$ w
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
( c- ?; y8 ]9 q! M+ t& V6 g+ K
<%
3 T9 B3 `1 ]% b R: }/ F2 ]
}
- o# g. `- g, i- p7 O) C
%>
6 P. `1 m9 y. L. S% E
</select>
6 N# J+ B$ ~; g3 `% D
</td>
! s7 ~9 X; U$ W# ^
<td>
6 [& q+ C; G9 O7 s( X
<select multiple id=city style="width:150;height:200" class="bgc">
) ~- {* r d3 u) N) I9 Y
</select>
- L0 _0 X. a9 P* w3 G0 b
</td>
6 [3 x3 ^+ U6 H! N" s
<td nowrap align="center" class="bgc">
3 E7 x5 o( t8 b, o4 Z
<input type="button" value="<<" class="buttons">
, _) f. p( ^' m0 \9 R6 V
<input type="button" value=">>" class="buttons">
* d% E+ t% F* h0 y- D- N
</td>
/ r, n/ G$ e$ D: D; ^1 ]
<td>
' O$ N3 R/ \0 v& W. F
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
2 M) d6 G& b @' b c8 ]5 a
</select>
1 {0 _' {3 J4 A% t8 ?
</td>
, R5 H- o4 w4 H# L% r
</tr>
- X/ l3 v2 X. [$ _
<tr class="bgc">
8 b: E/ q" O; T6 k8 I- E2 f) N
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
) r9 V9 w+ ~3 s! E1 }6 q) l
</tr>
% U6 d, A2 R$ f. B+ ?
</table>
& Z/ u# E: ]4 @+ Z) u( s
</form>
# l3 u: v4 X Z; j
<script language="javascript">
, w! V8 Y7 {' s$ w8 \, S. j
//人名移动
: M( H, [5 N3 _7 j1 D
function move(fbox, tbox) {
% m, i3 _7 S1 }* z; U
var arrfbox = new array();
0 x% q7 b4 X4 u- S3 f) B& L) U
var arrtbox = new array();
+ I8 I# D$ }+ j" E$ e- \
var arrlookup = new array();
7 o4 P Q9 T& h4 u
var i;
) g: s2 ]1 w. v, K7 o
for (i = 0; i < tbox.options.length; i++) {
% V1 r3 R3 c9 k1 ]/ @3 j
arrlookup[tbox.options
.text] = tbox.options
.value;
7 y. d5 g8 i# a* r( I7 d( y7 [
arrtbox
= tbox.options
.text;
% K' o# } a. a
}
9 R! L' k- ]7 @0 Z6 v; O* x7 }
var flength = 0;
# U& j9 M8 J" l- g1 G9 b
var tlength = arrtbox.length;
! s# R# A/ m. R
for(i = 0; i < fbox.options.length; i++) {
& R- i7 b$ U4 T! a5 g
arrlookup[fbox.options
.text] = fbox.options
.value;
e2 S& g. j1 i N; P
if (fbox.options
.selected && fbox.options
.value != "") {
1 m1 P/ _+ F5 {: O' ^- g: v/ w$ x$ G
arrtbox[tlength] = fbox.options
.text;
% v1 z7 I' v1 I7 X P% s
tlength++;
' H" @' |8 t3 w6 m
}
4 {7 [$ C2 x; z) X* {5 U4 @. ?
else {
4 E9 W l0 m$ Q) `3 T: N9 @' b
arrfbox[flength] = fbox.options
.text;
- |% W5 X3 `, J' B
flength++;
' x# q5 v+ Z( y8 ?, j( F- u
}
: K3 E0 G2 e0 v
}
, z* \6 S. D/ ^) w9 P; W
arrfbox.sort();
. r- f2 ]$ E y, V; N3 U
arrtbox.sort();
- t" @7 p+ l# o( F7 o8 ]6 L1 S
7 @& u' S! N3 V+ O' O/ h
fbox.length = 0;
: m0 o" L4 s8 U' o4 g a/ v
tbox.length = 0;
7 z9 T+ F4 d s! ~& ~: D
var c;
) F: W8 @2 N; M5 O
for(c = 0; c < arrfbox.length; c++) {
\( Q0 L" } }, _8 ^! m# Y
var no = new option();
- f. {; q$ v5 o9 A% m5 x
no.value = arrlookup[arrfbox[c]];
7 t# Y1 H! }% @2 @# R
no.text = arrfbox[c];
8 K$ ?& |7 V3 e; n5 F S; l9 q
fbox[c] = no;
/ ]0 [: f2 q8 j4 f; u
}
# @) b3 R/ r# C1 R! J* V2 c* x
for(c = 0; c < arrtbox.length; c++) {
* H& t( S$ a* P2 x! B
var no = new option();
2 @3 {9 B1 z. A4 G+ S3 ~- S
no.value = arrlookup[arrtbox[c]];
* {( v7 z8 ]% k5 [0 Z
no.text = arrtbox[c];
; N* Q- j2 b* b. S
tbox[c] = no;
. H+ W6 `& P: J5 ~
}
! i$ F3 {, N" r |3 }2 ?2 m) p. d
}
7 _4 R) f; ]1 T: W4 H& w- m. k
</script>
: F9 G) R# E3 E9 ^1 N5 R5 R8 ?& V+ L
</body>
1 Q, M u8 t5 x: y- ?* L2 ^
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
