标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
3 m% I, q2 i, |; h
c pageencoding="gb2312"
, {+ E J$ v8 d! o
%>
$ |9 V% y1 A; D8 F$ K! c1 ]
<style>
) _$ c) q7 ^+ j6 d
.f9{ font-size:9pt; }
+ m n' @' U) I3 E1 h4 A
.bgc{ background-color:#aecaf9; color: #0033ff }
" s- _# Y7 X% |
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
a6 C- g( ^ a+ O. b/ l3 R" G
border-bottom: solid 1px #4e7dc1;
8 c8 X! u9 v7 Q2 T7 \
border-left: solid 1px #aecaf9;
* R* c1 y' Z9 H6 k: X4 J
border-right: solid 1px #5679bd;
2 _2 I" a- j2 p
padding:1px;
6 c+ r" L) [" z$ \, }% Y
margin:0px;}
4 O* V- k! p( d' v
</style>
5 i$ I0 ?8 ?0 }- J& F
<script language="javascript">
* I" f0 G1 c/ M4 h" w
<!--
4 W+ D, B" n* E5 N7 W: W
function rv()
( a% Y3 v* w' \- c N1 p: _7 P
{
* ~) x+ U" i4 X5 Y8 F
var val="";
& `( j' L* ~0 d7 B. m# s) O4 o6 a
for(i=0;i<combo_box.list2.length;i++){
" ~9 Q* h- m2 r0 C* V5 f% @- R1 ^' ?
val+=","+combo_box.list2
.value;
3 B: s, O- \3 n0 c& ?% P
}
' O z# q3 J1 T- q/ e
if(val.charat(0)==","){
" D- {" Z# E. K
val=val.substr(1,val.length);
5 w1 B) P* L- y. \& a( P/ |5 F
}
' f- A2 y# `; K0 A; j* z8 y
opener.form1.frecname.value=val;
# \! g$ [! z& ]) l0 c! K5 A
self.close();
! S8 x: a7 ^+ M2 X
}
* D g2 g; c) l5 f+ f5 h
//-->
/ p6 p7 |3 D* y/ u/ T; p/ G. _5 R; C" X9 g
</script>
& B4 T/ x! k& y$ R. O, g; I$ S
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
+ {4 t! K# ` {2 ]" A
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! v9 f. s; t& j7 M$ H+ B2 S
<%
- L9 Z3 ]# k$ l `$ f
cdatasource ds=new cdatasource(); //数据联结bean实例
" f7 M2 O2 S7 q- q
java.sql.connection conn=ds.getconnection();
2 L4 v& x; x+ q" D
java.sql.statement stmt=null;
1 Q# k4 Z% y, L0 o! ~+ m
java.sql.resultset rs=null;
3 e; T" J8 v! p6 u3 ]
cdatacheck dc=new cdatacheck();
. v* Z. e. n7 q# J1 N0 I
%>
' I' _ d7 A! J! |0 o( ]1 V) {1 Q
<%
) u- E8 @9 \! k F1 p* 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";
& A+ C% }. C. h+ `. G* X' U
stmt=conn.createstatement();
0 o3 v; `+ E. |
rs=stmt.executequery(sqlu);
6 r- n' u2 h# _' m/ @, i& A: W$ o
%>
! Q5 N* D3 T) ^8 x* Q' w7 Y* z
<script language='javascript'>
, q2 J* z# f, g4 T4 c& k; w& ?
arr = new array();
; \# Q2 q7 |: h& O: m
<% int temp=0;
, n5 M5 U" y3 M
while(rs.next())
8 F; r/ l( b0 z
{
* ]) T4 f. P( M9 C2 T, C
%>
& J/ X8 i2 W3 x: [* {' z+ H# p! y
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
$ S3 D4 l: C9 K" t% g- m
<%
/ ?: S. C/ @) L7 b. M D
temp = temp + 1;
' t1 h5 b* X) M2 |# b
}
) S7 [+ n( X6 M8 m4 ^9 z& D
%>
8 d7 e1 ?4 ^( Y) W7 K
temp=<%=temp%>;
S8 y" A9 H; C: O2 s
function changelocation(id){
& G* I9 c& L% s* |, I; I! [) H" ]* x
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
K& ?5 i! Y0 h7 M5 I$ O: D
var i = 0;
" j' r M9 y( W3 w# b
document.combo_box.city.options[0]=new option('-------','');
2 ]- j& N# C4 X- |$ E
for(i=0;i<temp;i++){
$ E. E, x% B* }4 J5 p( B( @# j
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
# d9 i* s" w# ?+ G9 R7 p
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
/ O0 B g( y5 A# u' I( |
}
7 T) A o9 J" q$ e& L6 |2 B) G
}
5 U- e4 O0 i# f: X! a( U/ s
}
2 X! _9 l3 E( c8 p' k
</script>
; h* F3 }7 {; a6 q; N' b$ p3 `7 {
0 [# B# k! [$ [4 X, P; h1 C
<form name="combo_box">
4 W2 V& @" ?! n9 \8 ? a# O
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
) ^6 @3 e% B1 p$ h+ @; N
<tr height="24">
/ S8 i3 y* u, {3 W+ z7 {# r' @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
2 h1 N0 w, f& d. C& R* d5 P7 W
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ ?& x. J! y. x1 T# B% t' P
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
/ V2 f: b2 S! f, @, i0 @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
k9 o" ^; e# D8 w4 Y- |
</tr>
, Z l z: ^. g8 x8 @; i$ p6 I
<tr>
/ K/ w" z3 ]- ~5 X
<td>
1 j: d4 s5 s, n" a3 T- w) s; d
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
/ q$ `6 w& g _6 \
<option value="0">请选择部门 ---></option>
% p/ c, \! B3 R# V+ X( G
<%
3 S, S/ B$ {) r3 G
string sqld="select * from tdept";
6 F5 S6 H5 K$ y, v; [
stmt=conn.createstatement();
0 x: l1 u" c" y6 z) x: ?: ~; X4 g% V
rs=stmt.executequery(sqld);
! f [2 q+ H1 S0 n
while(rs.next())
6 Y/ \2 W( M* D2 l1 f
{
# o5 _7 e- \2 n+ \
%>
2 U. ~0 [+ i- [
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
& A$ ~( f/ v) M, ~6 d+ q
<%
! y! w5 ]; ]& J1 X
}
* F- Y/ u2 i7 r1 F6 _9 B0 z3 \+ ^
%>
+ D$ B0 J7 [2 b9 e1 C' }0 [& X9 I2 K
</select>
9 t0 k4 Q4 k! L7 L* y( V' ?
</td>
* m/ W: v0 E3 b( U
<td>
* j: {; T, W, x& r1 D; j
<select multiple id=city style="width:150;height:200" class="bgc">
& m. X. W% v6 ~% r- v; f2 _5 q
</select>
& m1 Y+ B- ]# I& g- n4 a* m
</td>
; t% @ B: G( t2 K# O$ e
<td nowrap align="center" class="bgc">
1 x+ u' K* ^; h4 D: p# D
<input type="button" value="<<" class="buttons">
6 `9 v+ f7 b& r. G: g$ X% a* x% R
<input type="button" value=">>" class="buttons">
1 i/ t q, B! Z
</td>
) g, T( y8 @8 ^4 t7 g
<td>
! k1 T4 M3 m( v) j
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
' t% G6 [) q: z' D* F
</select>
' L( s' q, R" O6 |8 a$ B9 M" J2 M
</td>
% |! D$ m7 _& \$ b4 D0 A1 |; m
</tr>
8 [' I4 y `% b c; E
<tr class="bgc">
2 c) y7 J9 W+ D, q
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
( @( l2 T& J* [
</tr>
1 F3 I% s! p) D, j5 m
</table>
5 V, g3 j! Z' w+ m* I8 I3 ~, @
</form>
' O# A- m1 V, t( I$ P
<script language="javascript">
/ Q. _6 e) p, F
//人名移动
- Z! M$ @2 G) y x7 S
function move(fbox, tbox) {
" Q8 T2 R$ J7 |; }$ N6 B/ p% _
var arrfbox = new array();
7 i0 r& ]5 g# e, e2 N0 Y
var arrtbox = new array();
N( l/ @. `- Q2 }5 E
var arrlookup = new array();
$ h. Y7 j8 [) }, D( j6 I1 ?8 ~5 g
var i;
) ~# h9 L) E. f0 M8 H8 D
for (i = 0; i < tbox.options.length; i++) {
8 z, l1 c8 {$ y, _
arrlookup[tbox.options
.text] = tbox.options
.value;
1 A" O2 \4 {, i
arrtbox
= tbox.options
.text;
- x: C+ q5 y7 D; h( b4 U5 M
}
) p7 B' A( y) \: J0 H6 U
var flength = 0;
- b6 }1 h' A2 V! Z+ \6 K& @: k. H# A
var tlength = arrtbox.length;
8 G$ e% _2 p9 H) D4 ?
for(i = 0; i < fbox.options.length; i++) {
7 S& b4 l1 c" _. E& }
arrlookup[fbox.options
.text] = fbox.options
.value;
O- n8 h6 |# u `
if (fbox.options
.selected && fbox.options
.value != "") {
: [5 k/ O% a7 P, c) R
arrtbox[tlength] = fbox.options
.text;
1 z# ~2 P! e0 B; |; g {
tlength++;
/ K9 A) B$ D# H4 J a
}
& h$ F: M: p# r6 g; n% a4 h5 {
else {
' k" [( M0 W l
arrfbox[flength] = fbox.options
.text;
. w" ]* x) f0 C5 {1 y
flength++;
0 H" d+ ]6 s( X* N. K# v/ y; G
}
{4 b8 ?% b2 W5 W
}
% Q/ i# Z) f ^+ V" H8 G4 [. C
arrfbox.sort();
1 F; K0 \/ T$ d
arrtbox.sort();
& y5 M1 d- l% _) Z5 n- e
7 m: a$ x2 ~% v0 }- P$ g" o
fbox.length = 0;
" F9 D, F2 J; O6 {
tbox.length = 0;
+ q8 l6 C# F6 p; e
var c;
2 [: B, \ f |0 P6 |& L
for(c = 0; c < arrfbox.length; c++) {
' I3 V) a% [. V) k5 i2 j
var no = new option();
! b, T% p* P! F( ?6 Z ~9 k
no.value = arrlookup[arrfbox[c]];
) B$ ~4 U' ?+ Z: H; I
no.text = arrfbox[c];
0 K1 X8 p) \* W0 V" ?+ z+ ~
fbox[c] = no;
4 q3 A& M8 Z+ l+ o) F }
}
8 i, s* j% `" T/ m1 n* I* P
for(c = 0; c < arrtbox.length; c++) {
) B4 N2 W& B1 e7 g u% e& b
var no = new option();
8 u! \1 J0 D, w1 ?! [3 P7 M
no.value = arrlookup[arrtbox[c]];
, v1 n4 {" M/ J* y" a
no.text = arrtbox[c];
7 G% C! G" N6 J+ q
tbox[c] = no;
* u1 s: k* O" T. ?
}
! i/ v- |1 p0 F1 {3 s# S- g
}
) Q" a/ R0 i5 M, R: c$ s
</script>
1 L5 Z& S8 j3 J K
</body>
1 \; ?5 [# R# K* Q- X% f
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
