标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
$ v3 i7 N: R1 Q& |# Z" O
c pageencoding="gb2312"
6 b: r9 M" }3 e' O
%>
) U9 X! L6 y$ p- F- o2 i9 {- `
<style>
4 f) I& U" H% D& Y0 z$ f
.f9{ font-size:9pt; }
# w. S; b0 b' N) w$ K
.bgc{ background-color:#aecaf9; color: #0033ff }
; J( i* q$ p! Y& i' n) g' K
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
- h2 N/ Z& \7 G# W
border-bottom: solid 1px #4e7dc1;
$ c, h1 @4 _! A6 L) N
border-left: solid 1px #aecaf9;
2 l2 D% S& e" l' B. g8 C
border-right: solid 1px #5679bd;
2 u9 A6 u/ c# m
padding:1px;
- w) O1 D; q3 G* B' w& O
margin:0px;}
8 k+ W. ^6 V# _9 r l
</style>
" [- L* f( d# k* r' Q9 |- v& F" S
<script language="javascript">
/ ]4 F- M7 I" a z* z
<!--
! p- ?2 u$ z7 U/ a0 |# }
function rv()
4 }" r- m# r2 f0 {8 Y- \! K
{
& U4 c1 C7 C7 x- c/ m
var val="";
: y: d! {9 G5 Y4 x8 R* x) M
for(i=0;i<combo_box.list2.length;i++){
& r5 c* X- L: F5 [2 Z7 S6 e
val+=","+combo_box.list2
.value;
% F& t b4 l6 `7 x% C, Z8 b+ Y
}
5 y) P. L/ ]) z3 E4 s
if(val.charat(0)==","){
4 o! G) P/ ?/ D+ S: J1 h% F9 \
val=val.substr(1,val.length);
3 ]% {' g( L5 R! D2 W! O, {$ h
}
- ^4 B: ?1 H: W* i8 A% |' u
opener.form1.frecname.value=val;
9 J- F9 Q/ z" J: B& |/ V! n* d
self.close();
1 C+ s) U5 D+ c2 }" l3 T' ~
}
3 l' W" l; Z5 R& g4 m- ~
//-->
$ [( b% h/ W+ m
</script>
* Q3 Q( a$ U/ d% O
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
# G& h4 \4 j$ ^( ~
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
/ D% p+ e9 y3 E! b4 V" X* q& l
<%
* j- S) h; s7 g: H- ~& m
cdatasource ds=new cdatasource(); //数据联结bean实例
' h: h2 K$ v* O) o# ], i+ T6 T0 g3 f$ F
java.sql.connection conn=ds.getconnection();
" S- H) C s/ B6 Y" f
java.sql.statement stmt=null;
6 Q) T4 {5 T2 y# z) I, C8 \* v6 @4 a
java.sql.resultset rs=null;
$ k/ h& A3 Z7 n9 ~# }* x
cdatacheck dc=new cdatacheck();
8 J0 k9 d6 V. O6 ~6 s
%>
7 j4 D; Z7 P1 R2 Z9 q7 Y* r
<%
' h4 X" Z: ]& ^& `2 k! @
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";
/ |% t$ s6 V" O; y' u F
stmt=conn.createstatement();
T5 I% x0 d/ }6 T' Y
rs=stmt.executequery(sqlu);
9 M* _" Z" k, n% i* E; V! D# a
%>
2 \; N7 i- r. y# G# c8 O; h( u
<script language='javascript'>
8 L) A; p& y% j
arr = new array();
& y: K! \) @; y: _" ~% J
<% int temp=0;
2 _, F; p) v2 l& g# D
while(rs.next())
' H. F6 }( w4 d9 ^, t
{
( ~5 R9 ?/ L+ O; ]3 K
%>
$ H" V, r; c0 W/ B' G; c4 d
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
, ]4 F, U! H. g
<%
$ ]2 j& P2 Z) T& h
temp = temp + 1;
" P! [, e% G' W9 a: O+ h
}
4 b, H7 C2 |& i3 Z/ @
%>
5 i. y r7 Y( V' U+ |5 h# p
temp=<%=temp%>;
; `3 S5 }$ m0 f2 p6 h7 q) Q% k
function changelocation(id){
* I; \5 v5 m2 q8 Q* v$ L
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
6 o0 A- r' f; T% h
var i = 0;
9 a1 x% h6 p0 g! R6 w% B
document.combo_box.city.options[0]=new option('-------','');
, R& t( t+ A) F; V; H) y
for(i=0;i<temp;i++){
$ ` s/ k* s& {% U0 C% G
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
2 Q: ?8 |0 U' r3 e/ {. O( T
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
) k, W& V3 K6 ~3 Z0 p4 }
}
" J, y( t" v5 ^7 X$ @, }$ N
}
3 I( x2 F7 A$ u( `. i
}
/ \$ p! u- T- H
</script>
' f7 n* ?/ V( u* S& G" B
! t: u8 p t1 S+ N* i
<form name="combo_box">
0 X( ]( @! T" s$ }8 D+ G
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
' A+ I5 S7 z6 T/ {+ K$ J) i! d) q
<tr height="24">
4 W: i, \, ~5 k5 u8 T2 y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
* d1 Q8 g' q& k! Y1 z
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% y2 b/ _4 f' F5 f; _
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
# A2 X9 B. K6 H* A
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
: j2 j/ A/ Q# Q4 H/ K% m* e
</tr>
+ k6 _' k% a- b* D" X0 F
<tr>
$ n* l+ Z Z) E! {
<td>
) I/ `4 v3 C+ R6 l; ^! q# p" @
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
8 A/ f1 G+ Z" Q
<option value="0">请选择部门 ---></option>
& v+ |# R4 W" m ^8 K- D) d0 G
<%
5 R5 e" D( W0 Y6 _8 K& L/ J9 p
string sqld="select * from tdept";
5 K# h9 v; Y! f3 t. Y1 u( A* b
stmt=conn.createstatement();
# r+ v4 S3 m f' a- m9 U
rs=stmt.executequery(sqld);
1 p7 h0 o, ]6 v% |0 }
while(rs.next())
0 G* j- D, n0 _
{
2 x+ N' ? {9 U! N) h \5 M% Q
%>
8 ^: S- u I/ O
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
6 `0 j7 ?7 i: W9 D
<%
4 z! P: B% u" v1 @
}
. S- ]" {: G5 u5 w" d) t
%>
2 \! S' Q, Y u0 F
</select>
# g) [6 f/ @7 @$ a6 F+ U
</td>
, B6 C$ W$ O" C: X% f
<td>
7 j' D$ M% ?( N$ a5 m/ g
<select multiple id=city style="width:150;height:200" class="bgc">
6 g& l! K' Z0 I$ z% o
</select>
$ O) p f3 y8 Y, T4 l
</td>
. h Z9 ~+ j8 j* Q; s
<td nowrap align="center" class="bgc">
q% X8 p. ]% |. A
<input type="button" value="<<" class="buttons">
5 q# w- @. ^1 d4 n
<input type="button" value=">>" class="buttons">
- A2 f2 _) T- T8 w& E
</td>
0 U& t( P& T1 T9 _4 D
<td>
. J5 D! U& K0 w+ Y. \& t" m
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
2 n( r7 B& | I% e0 H) g h
</select>
1 U& a. V1 p: C/ H8 v: c
</td>
( W2 R& }8 b, |8 h* b
</tr>
1 E1 \) D' ]3 t$ m+ q7 c4 b
<tr class="bgc">
( x) |: {8 D8 N9 L
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
# f! K8 d0 r$ r" N
</tr>
0 ~: }7 Y1 B3 s0 R) h
</table>
: j9 q, u3 n, x, T6 R7 z3 u6 |5 Z% S
</form>
9 s5 T: N4 W2 ^/ G! M% p7 E1 r
<script language="javascript">
" ~- Z/ V5 X) a4 o; H) k
//人名移动
9 N& i( o; C4 g2 h; K
function move(fbox, tbox) {
* }. {) w W, B& ?9 z
var arrfbox = new array();
* {. I+ B; M' F
var arrtbox = new array();
1 |5 ?9 q$ `( {' N ~
var arrlookup = new array();
" B2 @/ L) ?& u! z& I
var i;
5 I( B8 j0 h3 Y: ^) p6 M J6 ^
for (i = 0; i < tbox.options.length; i++) {
% R9 o/ O% k! q; w a$ S
arrlookup[tbox.options
.text] = tbox.options
.value;
! y0 Z2 D6 Q9 a* E1 T0 n& f$ @
arrtbox
= tbox.options
.text;
& [6 G& o/ m% X: _! T* w3 M
}
- l; H; P' U( a3 E2 E8 @+ k
var flength = 0;
! G) H& k7 R1 i% n
var tlength = arrtbox.length;
Z0 B5 k# E2 I# [1 P. z
for(i = 0; i < fbox.options.length; i++) {
7 p6 W$ k- f) K0 Z, G- G
arrlookup[fbox.options
.text] = fbox.options
.value;
3 e6 T* Y. o! X$ V; f( a9 b
if (fbox.options
.selected && fbox.options
.value != "") {
8 ? M. t) a5 ]' s4 \ o
arrtbox[tlength] = fbox.options
.text;
$ ^+ L, {) m2 ~2 Q, P3 F
tlength++;
* |, F5 @4 g' H# V" u" i) l7 n
}
# k. b+ `/ }# U% g3 c/ e7 [8 v/ } X
else {
- p5 r; |* D0 ]
arrfbox[flength] = fbox.options
.text;
6 F0 S( F& N. \3 @4 |
flength++;
0 q9 E2 ~" j! S! @" T" H; l6 p
}
" l, B! W1 K. z- x( M
}
v, H& G5 O' U
arrfbox.sort();
* b" b0 K- d$ M3 I' D
arrtbox.sort();
- s& t2 f; U2 @5 _! Q3 F2 {
8 w0 o9 o9 L0 j# j
fbox.length = 0;
8 B a+ p- Z0 K! ?3 D
tbox.length = 0;
( v0 k, w% J6 |
var c;
! f& b% b: d# e
for(c = 0; c < arrfbox.length; c++) {
; x7 i7 L3 i* j$ b
var no = new option();
: D% r+ d) u6 p* j5 z/ Z% n
no.value = arrlookup[arrfbox[c]];
: U& {2 T" D2 O- R! G- u) J
no.text = arrfbox[c];
! }) w0 X+ A+ z1 ]8 Y9 H5 M) y# Q
fbox[c] = no;
% B; k {; d# @: u. m
}
9 Q- s, Z2 d! k( ^4 K, `! R0 Z
for(c = 0; c < arrtbox.length; c++) {
) [- A8 d/ r8 e2 h
var no = new option();
$ X( X9 @- T/ V! g; ~8 X7 |0 N& R
no.value = arrlookup[arrtbox[c]];
' h2 C$ U2 Q, b) S u5 J9 }
no.text = arrtbox[c];
' B( \( P' l) ~
tbox[c] = no;
H/ t; L8 _4 X& r5 _; Y' E
}
7 _0 k+ g7 d. j$ X6 x1 z
}
% C1 ~1 H R& m4 {6 x
</script>
6 L% B3 r* Q# G1 l
</body>
9 a$ y8 h0 V" ]. R7 o2 _# ]4 Z
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
