标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
1 {; Y+ @4 o% r: [+ }2 Z
c pageencoding="gb2312"
9 Q2 K8 r7 O! g, s
%>
0 }9 N+ c& K* ?# e
<style>
- z: h9 i1 d( d% t; l
.f9{ font-size:9pt; }
, Z- v: w8 |8 L, y; _" Q
.bgc{ background-color:#aecaf9; color: #0033ff }
' }! p* s2 g( o7 F) t" g6 D
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
5 ^8 ?" C0 X& ^; O/ o! S/ Z' `* I. ^
border-bottom: solid 1px #4e7dc1;
+ ~* v* G- l( @0 i3 D9 [1 ]! J
border-left: solid 1px #aecaf9;
) |0 U' e$ f. I+ u8 o5 O; ?
border-right: solid 1px #5679bd;
I% _% H& q# {) d/ c
padding:1px;
3 S5 n' C, L l3 C
margin:0px;}
6 J5 ]; x2 c! m4 N# |+ D
</style>
5 e5 i8 v0 f' U& A6 G: a
<script language="javascript">
2 F* F& i- m, U2 e. Z
<!--
; G$ N, F- R: F7 w2 v9 L" p: P
function rv()
# S* p$ c' h& N- g0 @) M3 i7 o( m
{
1 q! H' S) Y' p8 \( E2 @
var val="";
% A8 S( W0 K" |$ r5 z& h9 q
for(i=0;i<combo_box.list2.length;i++){
( e2 B5 v, N7 d
val+=","+combo_box.list2
.value;
9 I+ S8 b7 T% Q
}
& q$ P8 S! F$ G& f9 U* }
if(val.charat(0)==","){
$ p! h8 J/ _: Z5 M4 y' l6 u/ M
val=val.substr(1,val.length);
4 o4 I- ]8 _. @+ D3 ]
}
; o6 F$ t C v$ R7 X
opener.form1.frecname.value=val;
# v) x a! T1 t& [( S! A
self.close();
f5 Q( P2 U. z9 c d. Q8 _
}
# E1 ]5 F4 u: w
//-->
8 m$ D5 Z& E( k' ?. M( Z% l
</script>
- }" [. o# \; s3 ]' ?
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
: d6 n, a0 y* }% p; z
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
7 C1 p' y5 e3 z* x g
<%
. B' @ Y& r" w$ X
cdatasource ds=new cdatasource(); //数据联结bean实例
+ F f) k A6 b" N8 X( a% U
java.sql.connection conn=ds.getconnection();
' t" @1 G; R2 U+ |. O) i
java.sql.statement stmt=null;
A7 j S- O3 L9 o8 k
java.sql.resultset rs=null;
* X& @: |. N6 `% W6 I& U/ M
cdatacheck dc=new cdatacheck();
& Z& k/ v7 {+ D) V5 r I
%>
9 N# _2 z* h3 K8 `, F b4 T% D8 p' Z7 y
<%
p) g4 B: l$ _# v1 Y
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";
5 ^0 t2 N) c; O9 V, P% J6 A
stmt=conn.createstatement();
: j5 d5 |+ D( K
rs=stmt.executequery(sqlu);
* ? n% c" a- q
%>
9 J6 L Q+ N% {2 H* Z+ A8 ^0 m
<script language='javascript'>
* ?1 p( L3 M4 M l: n
arr = new array();
" f$ l8 r" h5 d* H9 j- I
<% int temp=0;
9 k$ O0 u3 e' Z! S! U+ j
while(rs.next())
" D( o2 ?1 j: S" ^ n: |% f' A
{
; Q z) r; v ]5 r& [( Z+ E/ e
%>
, _! D1 ] [, v# S7 n
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
0 U' S% ^- N( G+ F: Q
<%
0 l- Y) {% M5 t" W
temp = temp + 1;
9 |' T6 `" A/ S3 T; b3 E9 s. X
}
5 [, L0 c0 V/ ~
%>
1 m+ O( h' x" t
temp=<%=temp%>;
3 ^: a6 V* g' ~6 U6 c
function changelocation(id){
! k/ J$ j. r7 g% ^) Z1 r
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
" M+ u2 O6 S* Y2 ]5 u& f3 h
var i = 0;
8 ]8 i+ ^: u1 m2 p/ Y% k
document.combo_box.city.options[0]=new option('-------','');
# Z2 [9 g2 F/ `$ x+ i( s
for(i=0;i<temp;i++){
; m4 O- z6 v4 a+ O7 k/ i
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
) @9 O6 H: @$ o D
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
1 |" V. ^, b2 Z+ U
}
6 T. G% ?5 R, C9 k: m/ H
}
4 }0 z, c$ o/ Y2 i% d
}
. Z& L/ ^( S1 Z! J, V* Y" o y
</script>
8 G* k6 J+ v( S, W5 k
" S c/ C7 L# w4 U6 L1 T6 W& J! Y
<form name="combo_box">
4 J3 ]" U, ?+ K/ N: ^
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
% v9 D- C! s/ l3 F n" z, p
<tr height="24">
% |1 l, h5 h8 T% L5 e6 V' ?
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
" s$ P. W" [4 r8 E; {: d
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
' P3 v, i0 B- V% U: A
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
/ l$ R5 }+ N0 h2 N* D) F2 I
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
) B: G" {# ?+ z8 X' U; X! Q$ g
</tr>
f% U! f) f* m5 v9 `6 K
<tr>
! I5 j& d8 u2 B
<td>
) s" L9 u& t& Q" h
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
. u% X1 n E. X; S% ^+ j. B
<option value="0">请选择部门 ---></option>
8 a' t9 a4 A [1 b6 f
<%
, I2 u( p8 `0 O% J# X
string sqld="select * from tdept";
& [ X* l' q' T* F- }
stmt=conn.createstatement();
& ^! }8 k. H+ l! C$ M7 q1 U" A
rs=stmt.executequery(sqld);
/ ]1 a9 }. X+ m1 [) S
while(rs.next())
# J5 d3 d; w3 ^ G. U7 L
{
' j, B& Y" b# `% b& a3 ^
%>
@# ?$ P6 e8 X2 z
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
* o0 j( \2 |1 J( Y3 B' j
<%
0 C9 Y* C9 `. W/ Q& g( t
}
* e1 z. x& c& s/ j O
%>
) @; y! H- i# B6 T
</select>
% f# h& l0 ?" ?' M! C* [# b) p
</td>
9 j7 O! s9 u$ z! v1 X- y$ `$ L
<td>
* o$ f% l8 X l
<select multiple id=city style="width:150;height:200" class="bgc">
) Q: H8 T6 s- s: b5 V4 z
</select>
# a3 y- D7 {: ^
</td>
+ y. m! f9 u9 @8 N
<td nowrap align="center" class="bgc">
! z1 t& D3 g/ v) j# {7 O3 G( k
<input type="button" value="<<" class="buttons">
- _3 j$ H6 X ^
<input type="button" value=">>" class="buttons">
3 }; \5 k( b' n: b$ d% b6 Q: Y, u
</td>
, {+ A. T5 p# [. M
<td>
. u8 H% c0 ~( m, W/ t7 h" U* w
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
8 B+ T/ ]) s6 H8 e0 p! Y( k/ \
</select>
( ~2 A$ I- H9 H9 e8 N( i
</td>
( `4 M5 K' U& s6 W9 O/ U
</tr>
% G- Z5 m/ o& l( G; Y
<tr class="bgc">
" J. F) y0 ~1 H
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
) {) f* f$ s* |
</tr>
7 Q. t7 n! P+ H6 D/ X
</table>
, B6 I2 ]4 o& Q4 d/ W( ]
</form>
# d. o# |& a) ^+ o8 x
<script language="javascript">
% S4 u A, S. S$ \& z
//人名移动
+ p% R( T" P( N) N+ A: `8 K
function move(fbox, tbox) {
! H* ?, s/ g7 P8 a' m/ c
var arrfbox = new array();
4 I: I( n S F! n
var arrtbox = new array();
5 E1 V2 F0 i) Z% {& M+ v! U% U5 N
var arrlookup = new array();
* U0 ?! ^, {% a& ~( s x/ X0 |
var i;
8 _& t6 \) B% _8 t: d8 Y' G
for (i = 0; i < tbox.options.length; i++) {
: Z1 H- f2 y) A$ S5 B3 h
arrlookup[tbox.options
.text] = tbox.options
.value;
: ^( Y) R9 ^8 F9 e
arrtbox
= tbox.options
.text;
I T2 V+ v, p; ^9 _% b" |6 A
}
( s9 E. Y: s7 j/ Z
var flength = 0;
( b& g# s! \7 g$ t+ s, Q" i
var tlength = arrtbox.length;
5 s0 K1 y. z0 Q! Y
for(i = 0; i < fbox.options.length; i++) {
8 G/ D: \8 P6 t H* b% c( }5 }
arrlookup[fbox.options
.text] = fbox.options
.value;
/ @$ E ^: H' j" A+ A4 M3 b4 ]
if (fbox.options
.selected && fbox.options
.value != "") {
* n$ N3 E: m9 D9 h
arrtbox[tlength] = fbox.options
.text;
: C) ^+ X1 p2 K5 X4 E( ]/ |
tlength++;
' q3 O U( ~2 r4 a* }, `
}
- E) S$ R* i/ u: U* s( \* E
else {
; U0 ^& s1 I( k2 y- N/ u, n& e
arrfbox[flength] = fbox.options
.text;
' S' P( k( C) E0 K0 Y9 K( X! Q
flength++;
% \9 U- g+ I& T% u; f/ P/ i8 a) T
}
3 a4 A; E6 x6 l1 H4 D: F: [
}
) D) R6 ?$ Y( ?, i; j& H" R. o
arrfbox.sort();
! w9 T* o3 v! y9 b' E$ N4 P. d! A
arrtbox.sort();
% g5 ]- @/ l( k ~% r4 \
. r0 @: v1 L9 s {7 C
fbox.length = 0;
2 f: Q; f3 H6 s1 z9 n/ n G
tbox.length = 0;
. Z$ I! C9 f7 s! y! k" M& |* q
var c;
, s$ P! Z7 i& ?
for(c = 0; c < arrfbox.length; c++) {
' g9 R" }4 W9 e* O
var no = new option();
t9 M5 y8 X6 ]- ], G+ A. \; B: E
no.value = arrlookup[arrfbox[c]];
! P4 S/ k( Z! H
no.text = arrfbox[c];
[! U& U8 x2 D- H$ e3 F
fbox[c] = no;
% E) X) d1 t2 X( w: l
}
1 v% J$ h4 ^% c: ^. o) n! r* }! G
for(c = 0; c < arrtbox.length; c++) {
W- P. N8 r9 i# V4 y3 | ^ G
var no = new option();
; r% D6 e2 k6 d% C B0 W
no.value = arrlookup[arrtbox[c]];
9 {# X/ {, @( A, D
no.text = arrtbox[c];
M# _; e+ [. v: \/ V- q/ {
tbox[c] = no;
. K0 T0 V d% K
}
1 l$ X: f; ? ]3 g; y
}
5 A9 N, T% [ @$ x F. T( x
</script>
+ _$ h$ Y( j1 p, _
</body>
# f: b2 X$ F" d* Q$ j
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
