标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
0 L2 D! M0 c5 S% m. B7 S) S9 y1 Q) Z
c pageencoding="gb2312"
7 @6 A, c# g" ~% L) F
%>
& c' i2 l# g+ d6 B0 X. @, ~" s
<style>
) c- _, m1 y& O1 t! x' X
.f9{ font-size:9pt; }
' X0 b4 I' k! I
.bgc{ background-color:#aecaf9; color: #0033ff }
9 u9 |6 [7 x& R3 |2 _7 h
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
) s/ l5 L9 n/ K2 r6 u2 v2 C* m
border-bottom: solid 1px #4e7dc1;
V! z" Q5 [) v% C1 w% p2 n
border-left: solid 1px #aecaf9;
_4 U. g; _; J E- K# ?
border-right: solid 1px #5679bd;
& d. i O& o! K8 k& `) E
padding:1px;
, s$ |2 \& w9 i& x6 M2 ~
margin:0px;}
8 z7 L- A( n6 ^3 D3 e! K
</style>
3 K: S3 ?, W, n: t& T, {5 c
<script language="javascript">
9 P2 I/ ]1 A/ J5 q
<!--
$ l, n% S2 k) u. P. h* b: m' _$ R
function rv()
9 p. z' o! c ?/ t: z/ G7 |0 G
{
9 r+ C' a5 N) N8 k8 u9 C
var val="";
% i, K- W; f. A: ?
for(i=0;i<combo_box.list2.length;i++){
% `6 c& D+ ~, _) e; k1 Q
val+=","+combo_box.list2
.value;
, v$ f7 x9 N2 g9 ~$ _: Q
}
9 f9 u1 C- j' t5 L5 u, l; s6 B5 m
if(val.charat(0)==","){
! m1 w, A7 `3 y& ]
val=val.substr(1,val.length);
) Q! h7 ^1 p) h+ O) C
}
) h2 e `5 k; L; | h
opener.form1.frecname.value=val;
8 g# m5 o" @2 q3 |
self.close();
1 @, \$ a' Q$ q' K$ I
}
; s" ]- \2 f7 U
//-->
8 W- g, B8 w7 V
</script>
# y7 G/ u& s& i) f9 f& b$ l# x: v
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
: H. P- s* L; R, a
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
4 p7 g% f% ]4 s2 G5 x/ o; C
<%
4 }+ O& ]7 V( A2 `9 n5 C
cdatasource ds=new cdatasource(); //数据联结bean实例
7 h. m) {1 q3 r) ~( S& M
java.sql.connection conn=ds.getconnection();
) Z6 d' a$ P/ |3 q* p
java.sql.statement stmt=null;
( E! H5 y; N1 M" E5 H& W$ o
java.sql.resultset rs=null;
$ e, t" c/ j2 ~. O1 L- d" h
cdatacheck dc=new cdatacheck();
* z" q" r6 s; z9 o. {# m( @! x$ Y4 s
%>
% k) @( i7 M, y8 e" j3 B+ n
<%
7 e7 c$ t) @$ K2 M
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";
' @# x' e! P+ U1 w6 r
stmt=conn.createstatement();
! J8 V& U Z* A
rs=stmt.executequery(sqlu);
) O: P ?0 {$ F
%>
% E" }. S9 X: {. i. P: u6 w
<script language='javascript'>
% x; f/ {/ v$ G# I) T q L0 U
arr = new array();
7 H3 y: }/ h3 u f7 B
<% int temp=0;
1 G; S+ _* o4 h
while(rs.next())
, U! H4 C# Q( I8 m4 q
{
0 L. P9 e* E" _9 t0 E: E, D p: ^+ z
%>
5 C1 B0 u( E3 f$ z5 P
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
0 C& q2 H W- a
<%
: g5 K3 L2 d. j4 F2 e9 I; {7 n: U3 q
temp = temp + 1;
$ W: ]6 i+ b/ \6 L8 a: m
}
9 \) I& E- ~" `/ s* C1 a9 W8 @& d
%>
1 q0 `. ^0 Z$ @+ C& @& ?
temp=<%=temp%>;
4 J$ J; {/ w" y
function changelocation(id){
7 i( i a+ x9 z% Q+ _. L1 g( N
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
, B F4 o0 G& I0 g4 r
var i = 0;
" \+ x+ g. r a. d: w' n( E7 G
document.combo_box.city.options[0]=new option('-------','');
3 e+ O1 @; i( w: I# n. s* N& b: }
for(i=0;i<temp;i++){
4 B( s9 x) C- q# x7 g
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
7 c0 y9 n6 R0 X- M! Y* S6 H$ E8 u
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
+ P# w- ?. k1 g8 ]4 `" {/ S* V
}
( d0 b2 N# Z$ j l
}
8 @+ [. M$ O0 o4 m+ d
}
7 N9 K; o4 \: i1 _+ y! A
</script>
3 [0 L* t5 W" y" y7 {5 R$ E- L
. G- ^( {4 T) ]2 Q- [6 d
<form name="combo_box">
4 Y" r, S4 X" ^9 ~: E
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
+ f) r- X# E$ i. {9 N$ p
<tr height="24">
6 A, o# b; H+ M/ z, y1 f
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
) T3 y% Y ^3 o
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
4 Q' I/ V( }! q7 r! ?) T2 f6 W5 e
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
5 r, M( Q$ D$ [1 O2 d
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
& v q+ ]) ~6 R
</tr>
5 X r# M- @3 m
<tr>
5 A5 @6 _2 j+ t: O3 D! r) o9 [ T: Y* I
<td>
6 A& G2 ~ U: c8 @
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
6 N" D: N- H( R& r( P- B
<option value="0">请选择部门 ---></option>
" K6 q4 A: i1 x8 S8 h
<%
% O( H, A) K! p1 C' g/ T
string sqld="select * from tdept";
, h( `- z/ B. ], `+ y' P
stmt=conn.createstatement();
; g% Q. Z3 Z$ _
rs=stmt.executequery(sqld);
/ d/ @6 p' _+ D; B1 @7 }- L
while(rs.next())
- w3 z X$ ?0 ~% Y0 ?& B
{
" a# S7 b( b0 t2 d" Z
%>
$ b: @$ ^6 B" d& T9 P
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ @8 e. K4 g! F# l( p
<%
4 F6 @- M" G2 I8 B" }
}
, {# S: p |1 x; N
%>
6 R) D2 _" C0 T6 ~* {
</select>
! _$ f2 {9 c3 u6 ?
</td>
( T- c! t/ q9 I
<td>
% z% T' b9 O; d# l+ v
<select multiple id=city style="width:150;height:200" class="bgc">
F0 ~# g9 m4 p+ o' \. T; L
</select>
* Y$ [3 A: F& v3 ?/ t$ a
</td>
& C3 I! U! g1 |4 q4 W8 j
<td nowrap align="center" class="bgc">
) {! g$ w* |$ Z+ x) Y" R1 z( Y% e8 c/ W
<input type="button" value="<<" class="buttons">
/ y$ C1 v' g+ L Y
<input type="button" value=">>" class="buttons">
/ [- P" q! ^: ?: ?/ _8 y
</td>
$ A6 R) [% l% n* g6 w" R" c
<td>
! _0 {- v( @8 M& S
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
0 p+ U2 g+ V/ o% ?& |
</select>
2 E4 ?+ [) w: Y& }) a" q4 R- ~
</td>
4 j, z' T# F& V! P' A5 t! b
</tr>
- E S# y+ @1 {$ a, f
<tr class="bgc">
5 x: k3 z+ F( O! L
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
, H3 v* K" `. R% p+ E' |6 v" Q
</tr>
4 @! [- h5 {6 S, l$ b# T4 j
</table>
7 v/ S, ?0 }( A" Y5 _$ V9 w. Y
</form>
% f& s' T$ U3 _" L
<script language="javascript">
& C4 |5 d2 @8 D m7 z
//人名移动
( r9 `% _) D* Q- v& J
function move(fbox, tbox) {
# ]0 ]- d4 S6 i- N+ D" ~
var arrfbox = new array();
! F! {/ ^ o% h. S
var arrtbox = new array();
9 J0 R4 i6 D5 S6 _ ~3 v6 ~( k3 o; Z
var arrlookup = new array();
/ D' ^0 G4 @$ D" ~% Z, @
var i;
' c: L2 D/ u6 d4 ^8 c
for (i = 0; i < tbox.options.length; i++) {
7 N' t9 r! b4 Q2 _; o
arrlookup[tbox.options
.text] = tbox.options
.value;
. F! [' f: ^, D+ o' C
arrtbox
= tbox.options
.text;
. D" T3 x6 t$ w* W$ s
}
& u1 G8 a0 A+ @. p
var flength = 0;
5 ]( I& [1 j- z, A+ @ `0 ]2 X7 u* R
var tlength = arrtbox.length;
8 F8 c1 H/ g3 ~1 G
for(i = 0; i < fbox.options.length; i++) {
. ^) g- J/ n, [
arrlookup[fbox.options
.text] = fbox.options
.value;
3 Q# S" B" k* e5 f
if (fbox.options
.selected && fbox.options
.value != "") {
& m3 [, U, N1 I0 c" f' L
arrtbox[tlength] = fbox.options
.text;
( W5 J% B1 X4 e' G
tlength++;
7 Q" | k5 a$ X1 a& j
}
3 ]# G; w8 _. u" d! j- _
else {
! F1 J' w* g7 u) r8 _8 y& E0 L& R
arrfbox[flength] = fbox.options
.text;
+ u. ?3 @; j' T/ D$ S t
flength++;
# W7 h- z* a. A; \4 n
}
% ~: R( W4 X) x
}
1 r7 r" ^% h. |9 y# U
arrfbox.sort();
- a6 B- L' K& q0 l
arrtbox.sort();
6 n9 Q# u& i1 m8 M$ b( \
P* Y4 z. W. M; V- v7 {
fbox.length = 0;
* q! g/ a$ ]7 m9 o* v# \1 \
tbox.length = 0;
7 O3 V4 T9 T! t4 _
var c;
7 c; ?$ H. \4 K" m6 z
for(c = 0; c < arrfbox.length; c++) {
; ?$ W7 A1 w G. C* u
var no = new option();
, _4 g9 J4 i; O6 k+ k
no.value = arrlookup[arrfbox[c]];
9 q0 x" V- T' v5 f0 l8 ~7 ^6 A
no.text = arrfbox[c];
8 t" y, X: g9 e0 W* n& a% K
fbox[c] = no;
! m! H+ y$ K) G- m7 A$ K/ L1 a
}
& s2 y' [ ?' V9 @
for(c = 0; c < arrtbox.length; c++) {
8 o3 a0 S! B8 I; Q6 }
var no = new option();
; A9 ^& S* B( S) c) Q
no.value = arrlookup[arrtbox[c]];
8 P, a( ]3 s- ?
no.text = arrtbox[c];
: ?5 z* o$ ] }1 n( ~" ^9 U5 o/ ?
tbox[c] = no;
# X+ P ^+ d/ q8 S% ^' O' v
}
! T! v& Z) ]' k8 [/ u
}
" @: A- B9 |. B; ~0 Y- k
</script>
, w% L4 q. ?5 s2 G0 U6 _, a" q/ q
</body>
# }; _) }: ^9 ~& X4 }
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
