标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
1 ?0 D- }& B, c9 ~* G' ~. J2 m
c pageencoding="gb2312"
7 F7 \" a8 u4 R/ H! Z
%>
/ U& s( n S( z. X0 z) [# p' \% u+ @
<style>
' G2 T' o0 X' m6 E8 S
.f9{ font-size:9pt; }
# C5 h7 R4 S G4 Q
.bgc{ background-color:#aecaf9; color: #0033ff }
* S+ Z$ u2 t! {- h7 T4 G8 }7 G ?8 B
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
! X) a/ J# ^0 h9 ~8 F& u
border-bottom: solid 1px #4e7dc1;
! q; _ X* E, x) R: R' g
border-left: solid 1px #aecaf9;
2 l9 c* N* ^/ Z& I9 L9 g. R, j2 S
border-right: solid 1px #5679bd;
# I+ e! z4 O( n
padding:1px;
1 N6 l7 e& t+ ]( `
margin:0px;}
$ J; t1 D0 R W3 x2 i- h
</style>
' Z! I) \, ~1 K# T
<script language="javascript">
& Z" y& D/ {. j% `; L# v3 r
<!--
# p# U" N1 f% D L- z8 H% l2 y) g- Q
function rv()
3 K2 W2 E! u/ z1 ] F$ P7 L
{
! j5 g, l5 p% n
var val="";
$ K9 n: A5 e$ _5 p4 e
for(i=0;i<combo_box.list2.length;i++){
' {& k) `2 J6 C2 T7 T* Z
val+=","+combo_box.list2
.value;
! W) ?% e2 E* q" P
}
0 j7 h9 m: t z3 m: m( h2 Y
if(val.charat(0)==","){
' k9 T; ]. h0 ~; Y+ T3 q8 t# m
val=val.substr(1,val.length);
" Y+ H/ u1 y3 j
}
5 |# j- n5 C" i4 u/ o
opener.form1.frecname.value=val;
$ g9 J' |% P' N! @$ u! A3 Z3 R
self.close();
) D# G. F) F$ l2 P9 j9 C- w6 d# q
}
, f' Z, T. X ]- v) }$ g3 D9 S1 @- ^
//-->
' x: c F5 s, H( P# c( F
</script>
( {2 B6 e# d' C0 f5 G; }
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
, M% l v, |8 ^+ U, \& F
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
( v* l6 i% E. f4 B) V& R, l
<%
/ }1 S' k. K. k3 G9 h* M. ]
cdatasource ds=new cdatasource(); //数据联结bean实例
" h3 {6 M0 V1 \& B
java.sql.connection conn=ds.getconnection();
( q. r/ g" G" U# l7 P8 x# a1 G$ @
java.sql.statement stmt=null;
0 o9 q" c, {: w
java.sql.resultset rs=null;
( S4 D$ \9 q6 y! S/ c# L& A
cdatacheck dc=new cdatacheck();
+ k F) T+ `3 u& \* O% d
%>
; H6 M# {7 T* ]) g% v
<%
0 Y5 x ]$ X9 ~: F
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";
( H3 a2 _3 G$ M
stmt=conn.createstatement();
1 [' M; o5 O( d, T- R- N/ A* W( L; L
rs=stmt.executequery(sqlu);
" b* C$ E' M7 M4 F1 e4 H( O
%>
- D% }3 ?& _* a! U4 p0 M
<script language='javascript'>
1 L- s* S @/ o0 V" z
arr = new array();
. [8 Q) k0 o# n' t8 z
<% int temp=0;
: B, U. j4 {0 R4 M; s4 ^
while(rs.next())
: N* D* X* M8 t, p! D( x& r
{
* l! h5 Y( M& _
%>
P" o* F) C5 n8 o$ U5 v+ [
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
7 A8 r# J& [% a6 c# ?
<%
* D& r- B0 V0 D O3 x
temp = temp + 1;
9 e. h5 w, B7 C5 L: \
}
1 a; E( _* q. K7 g y% R! w
%>
- t5 |) c% y8 R3 } P( D
temp=<%=temp%>;
0 J# g$ A& ] I# Q) o. A
function changelocation(id){
8 o7 q% q3 Q3 e2 N9 p
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
2 G4 B5 n0 C& L: ^8 o
var i = 0;
$ r& x9 X1 b% ^ G1 o" R" ]3 @7 m
document.combo_box.city.options[0]=new option('-------','');
2 |: P' Q/ U6 {: k
for(i=0;i<temp;i++){
3 M7 H5 z8 [: ^: a! P; M
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
K: Z5 h! x! Z2 c5 g7 P7 s
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
! f! H6 [9 S9 i1 r( y4 n
}
. X5 X3 @' | k
}
) t% L7 ]. R" N+ T7 m; V) A" ~
}
0 m- s7 q) Z2 i+ `: ?
</script>
5 E3 X% N3 M2 Q* K
) c/ c$ E5 O5 A( e( `, _! ~) Y
<form name="combo_box">
; G" @3 V- x3 e% N9 G
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
$ d0 T p: z& v9 f1 H1 l6 G8 i; G
<tr height="24">
: [- f! A. N) P9 Z( |
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
$ v/ a W! f6 D" c! |# D, |2 v7 ~
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
" Z6 C' Z& {# z9 j4 M8 s% b
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
$ K( z3 E4 p# W/ {
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
. t- b; ~ }: T3 |1 G# ~
</tr>
% }" b# r2 s; ]% |' e% L
<tr>
# S l7 b' l) [7 e/ q
<td>
! ]' r, W. ]) ~
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
, v H9 Z: N9 J2 M0 [
<option value="0">请选择部门 ---></option>
2 c: [" a) L J( D7 K- M
<%
) x/ A1 U( p! D, n
string sqld="select * from tdept";
% {) ^5 a1 L$ _+ `; p: I" ]
stmt=conn.createstatement();
1 g6 ~4 f% D) i: q( n
rs=stmt.executequery(sqld);
3 @$ ~0 \- S- o* e4 F" [& G
while(rs.next())
; Q' n; v' f3 S& d; R$ {; R) w
{
% A- [/ a# L, u3 C9 P
%>
4 w2 f! u y: l
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
+ s+ j& Z |4 f0 M; _+ y5 W1 f
<%
) A( E( y1 e4 W/ ]# u% {) R
}
% F" L/ L& Y5 `2 B" D: o
%>
1 ^: S8 |6 X7 w/ _( ]6 x
</select>
. M, S! j5 z7 A9 q1 B; I
</td>
, g1 `9 S$ Z. V& c1 `5 l. a
<td>
* [2 N, d9 U5 y3 I& G
<select multiple id=city style="width:150;height:200" class="bgc">
8 s( I7 K$ d V: Q7 Q% }$ n
</select>
- `8 P6 o1 L# b" n/ B# b# k
</td>
" c2 F' E: b' b- O+ N6 M
<td nowrap align="center" class="bgc">
4 n' d% e; o% ~/ d7 k) S
<input type="button" value="<<" class="buttons">
) X- C8 L# P& Q! I/ `' h
<input type="button" value=">>" class="buttons">
( H7 U4 K7 s, S6 o# E1 s
</td>
( r; ~; ^* L) \& C
<td>
4 Q- q, g: }! r2 A& Y" R! Y
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
8 z1 h, k! X) Z+ {
</select>
2 z) c. m: q! X/ j5 S
</td>
$ U5 ~9 J0 ?4 N7 I& `
</tr>
! j2 E) M( z, a* n
<tr class="bgc">
+ y5 i5 A9 J. m2 {9 L" h6 G3 j
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
0 t+ i; D/ c1 G$ \9 p2 o/ _7 B7 P
</tr>
: ?* d0 }2 J: {' y
</table>
' E; }; x( s4 s$ d# H( U
</form>
. M$ U9 a, a& k g3 s; f
<script language="javascript">
" k4 R( t3 @5 C$ J; C
//人名移动
- M* b5 b: {- k7 @
function move(fbox, tbox) {
6 u. L9 L, W7 A
var arrfbox = new array();
: H9 n8 A! t- ]* e+ w: R& B+ O
var arrtbox = new array();
" V4 P6 _* O; T% U2 g$ R6 w
var arrlookup = new array();
: N2 b0 u2 W" e, b# O
var i;
: d1 l: T3 }! c7 h9 P9 m
for (i = 0; i < tbox.options.length; i++) {
6 f; o8 C1 V; @& y5 `1 }4 V
arrlookup[tbox.options
.text] = tbox.options
.value;
( ^8 n$ a+ `. f4 N- Y! n, m* W
arrtbox
= tbox.options
.text;
# o: a' u8 j& f2 ^1 {, B8 @
}
8 }5 J+ _3 E4 f0 a/ g+ ^* Z
var flength = 0;
& V4 R6 U. T8 r+ b) z9 A3 M( Y
var tlength = arrtbox.length;
) s: J( `, y8 x# u, n
for(i = 0; i < fbox.options.length; i++) {
* p7 k* \# a( ?7 C8 f- ]$ Q
arrlookup[fbox.options
.text] = fbox.options
.value;
- s) R6 t. s1 \! Y' g
if (fbox.options
.selected && fbox.options
.value != "") {
+ {& ` L" }1 I6 e3 Z9 }7 y
arrtbox[tlength] = fbox.options
.text;
( C' w5 B( a6 ^4 g7 Q& \) q
tlength++;
* a/ f6 g. H8 i, N: u" _
}
3 v: n) Q8 L' C# U/ g4 G# D
else {
9 d. u: K+ h6 c0 Y
arrfbox[flength] = fbox.options
.text;
9 Y: B% T/ \! Q" [
flength++;
% t. q& K4 h) z+ T* F
}
$ s6 L0 r8 h" _2 |. [" S" k; {
}
9 f3 K, g1 z; h0 v8 N* H
arrfbox.sort();
- ?& f" n! U" q2 l3 o8 X
arrtbox.sort();
; w! S& p3 _$ h" M
4 a$ j. u+ Q3 U9 {, |9 Q
fbox.length = 0;
^7 y0 I( r& j1 t1 v* g8 \0 `
tbox.length = 0;
# S$ k) h/ C1 l+ ]; G
var c;
% ?/ C* w \1 o. D O8 L
for(c = 0; c < arrfbox.length; c++) {
! T4 C, Q* ?% s
var no = new option();
8 A3 J0 E5 L0 p& K/ i# n; x
no.value = arrlookup[arrfbox[c]];
2 k6 F" }' e) {: }/ h( M0 Y
no.text = arrfbox[c];
3 \% l5 X( S3 M
fbox[c] = no;
# t! W. G( Y+ |- d! b
}
# A4 O0 m( L# [6 `
for(c = 0; c < arrtbox.length; c++) {
9 X: l$ \; o5 I9 B# ?* P$ Z3 y
var no = new option();
6 Z$ |: |: t+ t6 a5 Q/ N+ q) g
no.value = arrlookup[arrtbox[c]];
$ K Y3 a0 @ g [7 o
no.text = arrtbox[c];
0 L: f( z9 o% l
tbox[c] = no;
, H. E0 R' i3 S8 \0 {" z
}
% J4 g$ S) V) I) v x/ o2 I# P
}
8 w4 Y/ ~5 I7 L7 j2 v D1 C& Y
</script>
( R$ w6 w; l6 m9 `1 F
</body>
) U* {8 y" ?$ _$ A7 J
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
