标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
, s$ |$ B3 I8 t% H7 M2 R
c pageencoding="gb2312"
* G( N7 y7 T, y8 M ?6 |4 R
%>
: j. [. Q/ y6 L
<style>
8 g: ]& f6 I' C; ], A) Y$ L/ \1 x) e7 S$ v
.f9{ font-size:9pt; }
) {- ^) H+ H! n& c3 x0 P- t
.bgc{ background-color:#aecaf9; color: #0033ff }
3 j) O8 V7 x7 d) Q
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
4 S9 _3 @; Z7 W. s' ~
border-bottom: solid 1px #4e7dc1;
5 g) V& o- I5 E) J
border-left: solid 1px #aecaf9;
( b h- a. J4 p+ `- C
border-right: solid 1px #5679bd;
( }5 w# N! G( y" K( l6 X7 H2 C' }7 H
padding:1px;
* B" t' n# S" F0 C" Z4 p" M3 a
margin:0px;}
5 ]0 ~0 t4 }; x1 ^
</style>
c9 |3 O- j- D- m
<script language="javascript">
5 B# O1 V0 i" J7 K$ S$ Q2 Q, r. ^
<!--
2 b9 V3 ~- p- B% ~- h
function rv()
% v3 h4 d6 H/ m4 s4 A
{
8 `/ L& \( O4 c; M, N# M% n& X: W
var val="";
* f( w6 ]& t; ?6 `3 U" E4 W ^
for(i=0;i<combo_box.list2.length;i++){
& a( ~& E" a& `1 `5 t
val+=","+combo_box.list2
.value;
( r2 S' ?3 ^2 I! B: H$ p
}
3 W2 G& O7 L( \4 ]7 t1 ^
if(val.charat(0)==","){
, `, F7 Z( x3 D) y" c7 J
val=val.substr(1,val.length);
/ V# m/ ?5 M, v7 k
}
4 E; @# \! K) U: x$ H7 A' b8 z
opener.form1.frecname.value=val;
6 H$ r5 B$ [& e; g: }4 ]
self.close();
& r/ M7 O# U3 i4 ^; X" i; x8 V
}
8 i z( D) M% e) o1 o
//-->
2 q) }4 c1 f v2 |
</script>
! a* q9 x1 @/ t2 s1 r
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
" S ?2 b3 r5 b4 r$ O
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
7 W5 S9 O" ?8 u" \- h p: R
<%
& [- k3 o6 ^0 y- R7 Y( b" C
cdatasource ds=new cdatasource(); //数据联结bean实例
: U, W1 G V: o7 s# _) [% v4 D
java.sql.connection conn=ds.getconnection();
, w2 e" P' C: Q3 H
java.sql.statement stmt=null;
8 e' `* ^7 z% U/ J, ^5 F
java.sql.resultset rs=null;
$ G4 z, K' o3 ~. ~+ Y, z
cdatacheck dc=new cdatacheck();
# i8 w; e5 A2 L
%>
) M+ T" L% V. h$ x
<%
6 W' v% V1 x4 |* v5 B2 U7 u; |$ e
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";
+ ?2 M0 [# Y- d/ k) u. X
stmt=conn.createstatement();
' |* N' J+ v% V8 r; ~0 q
rs=stmt.executequery(sqlu);
/ i1 Z; l+ G/ X" _8 c4 B# _1 p
%>
3 t6 u; Z* R( ?: k$ M y
<script language='javascript'>
% X& G6 M, P5 m5 }3 J
arr = new array();
- t4 |1 Y4 B% q
<% int temp=0;
Q' Y ]5 v' [. X
while(rs.next())
5 I1 H7 {; X; X* r. H7 l
{
9 R4 C, h! L* e! c4 n0 T6 U
%>
% K# M& R* f- x1 ]
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
+ S7 H5 N; \( Y
<%
3 x/ e+ }0 W& n3 D& P0 u
temp = temp + 1;
9 v( V; q3 {( {, {: z
}
! l$ ~1 o; p% ~. J% k
%>
5 K9 X" _: ]( V% L- {
temp=<%=temp%>;
6 ?9 z8 V7 A; }# E5 F* f0 g w6 D9 b/ S' w
function changelocation(id){
- a' W2 I. Z, l/ N
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
+ @3 m3 e7 j' k1 M! ?
var i = 0;
4 B: I1 E5 ]/ V; M6 ~
document.combo_box.city.options[0]=new option('-------','');
) w, Z R( V+ A. k8 \
for(i=0;i<temp;i++){
( m3 E+ @$ N4 i4 Q$ u
if(arr
[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
+ ^7 x0 w: D# M! T9 b q) e
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
3 T$ V: [9 W( z2 p! @) P
}
6 T* t4 m& ?+ U9 K" ?. {9 M1 ?
}
% `5 t: {, u* s9 s Y6 o
}
}1 D' e7 d2 j1 b0 m( }+ L
</script>
0 c& M+ h5 @5 Z# y2 f7 n
7 s/ N7 b" H1 f3 Q& h7 ? B4 x) W, g
<form name="combo_box">
+ a; p, P a+ J) @1 P$ ?
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
8 _+ T0 G* y: @0 W. t
<tr height="24">
& R( R2 U& U t- o$ q+ o- R
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
0 Z6 n# Y( x* q# Z5 {
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
- [. o& a+ M+ a0 P/ M4 x
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
2 o: ~; G- ^( n9 H$ L& b! n \
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
+ d. @2 J) Q# T
</tr>
0 U, {) g$ L9 G' @# s0 u, W
<tr>
9 i- X! q* f; P
<td>
: k5 w' l7 _0 A7 V# \+ a9 s
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
7 l0 g s: _5 ~. n8 y8 C
<option value="0">请选择部门 ---></option>
9 v/ o" n# w1 z7 {# D# @8 T
<%
# U) m+ j6 {3 c: S/ o, m
string sqld="select * from tdept";
) Y, I' P# ?1 e$ U; z9 s# f0 [2 m
stmt=conn.createstatement();
+ G# \: o! w! ~
rs=stmt.executequery(sqld);
5 S q! t9 W. f8 Y4 A0 k
while(rs.next())
4 G# y! m" b g( J3 i
{
& x! @" G6 L/ D6 m& d; F
%>
! ?$ U0 p. v0 X }; ?/ a
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ t! |: x$ a( \/ f! R {
<%
! t# K1 L! l" \( q
}
" ]: t2 W& d! a& @0 H
%>
* k& k- W# ^% c- E# N0 K2 Q b
</select>
) ~' f: n8 k; n9 r0 N& O! F; d
</td>
% v4 N1 N7 C6 y
<td>
6 o" V ]- |2 N7 [- I- i7 V8 m L# _
<select multiple id=city style="width:150;height:200" class="bgc">
$ ^* O* n+ Y( j9 m. A# r. ?0 P
</select>
$ d* b! b$ b* R! q% A$ v( E x& e
</td>
# w: q5 p- s3 o; A2 a
<td nowrap align="center" class="bgc">
r4 G3 [1 k D5 K5 ~% B, a
<input type="button" value="<<" class="buttons">
' D. j3 c0 T8 O. o% n* g
<input type="button" value=">>" class="buttons">
( r# S8 g6 {( W' R/ W& k
</td>
* d! s' X) |- c: D, S* N1 e1 X
<td>
' a C9 \% \/ q6 ]! {
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
7 [- a7 B1 B. D" c
</select>
" o0 Q1 z6 u# N0 r. X3 m5 U
</td>
2 _( P8 G2 x* T# f- d) Y
</tr>
9 Q+ Y; }) q& G9 \9 G: R j6 f! }% Z
<tr class="bgc">
3 C9 `- X& B9 Z0 ?) `% [2 z
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
4 |4 Y: L3 E, H1 ^; X
</tr>
8 |5 B) v# d2 ]
</table>
# }/ L" \" f: M
</form>
$ ], q: H, ^) Y. o. B4 r
<script language="javascript">
$ L! c9 {8 X6 G/ f9 V
//人名移动
6 u! v) L' ~% c% m, E3 A' u
function move(fbox, tbox) {
6 O% g0 ]3 {0 M
var arrfbox = new array();
/ Y; c! x! A; A# s d
var arrtbox = new array();
. {( x/ K+ @3 L, \9 j
var arrlookup = new array();
7 a. m# l$ P& J- U6 f+ ~% ~) q
var i;
0 E5 ]$ s* C/ q6 _0 P
for (i = 0; i < tbox.options.length; i++) {
$ z! n7 D2 [3 m! ~5 Z7 K- ~
arrlookup[tbox.options
.text] = tbox.options
.value;
6 ^ ^; H% W. B3 B/ L$ h
arrtbox
= tbox.options
.text;
) \% i4 C3 y5 F/ u% S; E3 ~9 h' d
}
. J+ ~: l3 N1 h- }& i' \- ?
var flength = 0;
( N7 N, Y% J1 |- T
var tlength = arrtbox.length;
9 q2 Z6 g! O$ q3 r
for(i = 0; i < fbox.options.length; i++) {
8 o0 g% x H- w1 H, A
arrlookup[fbox.options
.text] = fbox.options
.value;
6 Y `8 ~. I7 T. {$ V/ b7 g
if (fbox.options
.selected && fbox.options
.value != "") {
8 |/ U# \6 B8 ?+ t7 h) Y1 N
arrtbox[tlength] = fbox.options
.text;
1 P. K3 f! s! r3 H% q1 N' z9 L; u
tlength++;
6 E! v( X; u5 e
}
, B; f* b4 l; Q- P+ V; y
else {
! V% e# G/ y5 W8 _
arrfbox[flength] = fbox.options
.text;
0 I- d- r/ Y7 s& C+ @0 u
flength++;
; g* G9 @ P2 Z X6 p
}
0 M. b: t' e0 n) E/ s
}
" Q g. l; j4 `9 @# a; j8 ]: z/ [
arrfbox.sort();
$ q c# k, k0 s6 A2 h) j3 E
arrtbox.sort();
% o) l: _, I% A/ _
" O' C8 r2 l) Q( P6 z3 h
fbox.length = 0;
9 A9 O6 m1 B" s. w
tbox.length = 0;
4 H6 F) O- E0 j l6 ]6 W; O
var c;
, J. _4 C0 ?3 V5 F' Y: s& t# v2 T1 @
for(c = 0; c < arrfbox.length; c++) {
+ O) Z: e |) H" a; u
var no = new option();
! V' B6 b( D. I6 ~
no.value = arrlookup[arrfbox[c]];
; z& s6 b9 z* m3 `
no.text = arrfbox[c];
" u/ _" F: N, @. R9 ]' z2 Q
fbox[c] = no;
" O0 _2 K2 U/ Z
}
`% V. R6 \* r
for(c = 0; c < arrtbox.length; c++) {
$ o8 G& A0 |& X- a1 ?3 d
var no = new option();
& D f, @, l; r( ^! b3 n
no.value = arrlookup[arrtbox[c]];
* z9 C' \. T# b2 }" Y. w% _1 u
no.text = arrtbox[c];
. e; h# b8 Z- H# K3 F
tbox[c] = no;
9 N4 H8 A0 s6 X% e$ }( L. O' D
}
. `- n5 k( O- {' y% v
}
4 S; r4 H. H7 u
</script>
6 k8 c4 Q- o c- K" n6 n' S8 s: Z
</body>
8 {: M/ p! C- d% k7 ]
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2