标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
& g) G" O4 S2 c& s- _6 U
c pageencoding="gb2312"
* f& e {0 ]! C- {& k: S
%>
) N0 U1 v. Y3 `( D' Z# w) L5 t
<style>
9 g6 }) B4 L% K! t# v. w
.f9{ font-size:9pt; }
9 K* p$ K7 i' W7 Y$ C- m7 z/ p
.bgc{ background-color:#aecaf9; color: #0033ff }
3 v. ]( N, l8 x) e
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
5 f( u8 D5 `: @8 s+ L
border-bottom: solid 1px #4e7dc1;
+ Q+ o" j6 Z1 u% F3 a/ a
border-left: solid 1px #aecaf9;
7 Q. F! {) _! b* v5 D
border-right: solid 1px #5679bd;
+ f8 n' h9 U/ D! U# F& [
padding:1px;
; V( J0 Q$ w8 i) k" o4 U4 }' _
margin:0px;}
; Q1 S+ t% n4 F
</style>
|; Z3 n4 F4 u4 V' y
<script language="javascript">
) `+ ?2 f: h0 p
<!--
( @0 @' o j! y$ t: u' N% U7 V2 g
function rv()
% E: b V, H) q: C6 L. ^! n
{
5 g, }5 U! M# l. v9 c# l2 h
var val="";
2 ?+ E5 y8 P: H3 R$ w: Z3 U& ~
for(i=0;i<combo_box.list2.length;i++){
" u3 B- z4 f8 t/ P4 f" g' G
val+=","+combo_box.list2
.value;
- Q; ]$ [ m- k% V* r% x8 k
}
( T$ k% F# p$ ]6 O: p9 b' I
if(val.charat(0)==","){
7 h! \/ t" l% B3 U
val=val.substr(1,val.length);
0 e1 d! m8 K: o9 ^! R" @- ^
}
6 T) ~" W X. u
opener.form1.frecname.value=val;
1 _9 B* o8 Y( ~$ a) c( g# l
self.close();
. I* A: F% ^& B% F* N( f$ Y
}
J1 k9 R- ]4 \- P9 l7 y! \+ K
//-->
: J3 d& G0 h1 [* m
</script>
, x9 C$ o4 {2 |" B1 q9 A0 T
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
1 e; A: s- d$ W( ]) h
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
9 b2 r/ b% I% S' k
<%
- \ q* [1 d1 q; J: \- P: }9 T
cdatasource ds=new cdatasource(); //数据联结bean实例
7 s+ c$ I6 M$ s: K) P% v( d
java.sql.connection conn=ds.getconnection();
5 _ \/ }% Q3 Q$ O1 s% O
java.sql.statement stmt=null;
; C0 f7 c5 j2 F8 O+ T4 s7 d+ ?
java.sql.resultset rs=null;
% N; p; i/ C9 M
cdatacheck dc=new cdatacheck();
5 T0 g, ?% J" S' ?% t( L2 h
%>
& n* a" H! }! I7 f
<%
1 w* y/ } [2 ^: 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";
2 J/ l2 t, Q2 S, E' ?3 R
stmt=conn.createstatement();
- }) ]. t9 r/ y
rs=stmt.executequery(sqlu);
1 |4 u# N4 S% V. _
%>
7 E* F# }4 v- q, W
<script language='javascript'>
' b1 ]' [8 M& l+ A2 O' \
arr = new array();
2 w6 G; n) l8 q0 S+ A5 A6 n3 S/ C2 l
<% int temp=0;
, U* h4 R. A9 e; L% a' v6 }
while(rs.next())
5 h4 j8 C* T7 b9 `; d: }
{
( _8 M0 Y# R/ `% _) L& m
%>
5 P G V7 l9 ^6 ]. D( E' b5 T& S
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
: }8 M: E2 g+ O2 P% A9 W
<%
; g$ g! R0 N" G6 [1 R2 l6 j
temp = temp + 1;
, ~* C4 M* D: S' O
}
: l: ^5 @" }/ V- y, }* ?
%>
% Q S, Y+ H, K- d; Y$ ~0 Y. d8 [* g
temp=<%=temp%>;
" b4 `' d# ?0 W0 k9 |: p. e
function changelocation(id){
1 l& f0 x) b7 \( w- g! O
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
( u/ a5 q9 ?" I
var i = 0;
/ j( B3 i$ a/ \2 J6 l0 z' H
document.combo_box.city.options[0]=new option('-------','');
. b% z ~1 N8 y6 r4 {
for(i=0;i<temp;i++){
6 z% d2 ?& c" G6 o% O2 Q
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
# v9 g2 v8 e, @4 K% j
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
( o# _8 ^. o4 r% D/ @( M% ~
}
7 T8 T; c* u3 d
}
" ]# o; A( p% U' N8 y# q
}
1 d6 a9 |: x8 O9 _% b) L
</script>
* J) g. V( g; b$ d3 X6 e4 Z
9 P. M& ` U$ V7 R
<form name="combo_box">
& k/ f" ^0 L L' O) {8 N! K
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
2 |# w* d7 E, S
<tr height="24">
6 I* i* ^! N# J, w9 R, n' U4 c
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
7 i2 l/ x x* f2 A. P3 ]
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
; _2 G3 `& ^! i( q# Z& e, I
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
) l* J) u6 c' H0 U# L% W
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
) `' c- G3 r; w8 b
</tr>
; u+ m; x5 m& I2 n6 c# q/ `
<tr>
% ]) U+ `+ F$ Q" ?5 O; `1 _/ S1 \
<td>
( _; B8 N/ C1 Q# V8 x$ u( D
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
4 \& L2 n- ]4 G9 |/ L' Q
<option value="0">请选择部门 ---></option>
& N1 W& R* r9 H8 E/ H
<%
/ P [4 o) k# p6 {5 \4 G
string sqld="select * from tdept";
1 {' S3 D2 M7 F% j& L" E
stmt=conn.createstatement();
& z- ~& a3 M$ u& V) C* w3 z
rs=stmt.executequery(sqld);
' y0 j; Z9 ~" X8 e2 |% ^
while(rs.next())
) j* d; Q/ E0 b
{
) Q/ @! e% M) B$ y! z6 M
%>
; V8 U) O- r5 d* O; l$ o& V
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
* U7 V. G* m2 o" v
<%
; |3 T! A! U. O% W# _% |5 o
}
+ r/ K7 G: q1 e7 I O
%>
( J6 o `7 W6 {+ K% ?1 t& W
</select>
& i1 S$ r+ q$ S% ]4 l- l
</td>
4 \$ y, ]8 F1 _7 ^5 M
<td>
- G: i0 K P& V# l; I
<select multiple id=city style="width:150;height:200" class="bgc">
$ N+ b8 d3 B* x2 }5 z
</select>
0 T$ e; Y; E; ~! r1 ?: t
</td>
. s) A1 }6 F1 \2 {! M% b
<td nowrap align="center" class="bgc">
) o8 l. C/ o1 W$ Q* M7 I0 ^; j
<input type="button" value="<<" class="buttons">
* X3 l- a4 T( `) o6 _; A- \
<input type="button" value=">>" class="buttons">
, |) k+ ?4 u# d
</td>
* W9 B$ F8 z1 D9 y) b; a5 X6 `
<td>
( B. W7 M$ R' c) \- }
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
8 \& n6 y5 o* R4 p' \9 D
</select>
3 z3 e! d4 x) D# e+ s
</td>
* e4 I3 P/ p* c$ Y, q8 d% m8 w
</tr>
" T8 o9 S6 e! ?2 M! ^
<tr class="bgc">
9 m) ?) P# P+ l. K# A. g+ W
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
$ F7 e% r6 r. O4 u
</tr>
2 i2 A/ f+ F! Y, Q( P2 Z
</table>
2 g" ^2 z$ s0 k$ F3 ~
</form>
3 @' C; \8 K; K- x, u8 O! ^
<script language="javascript">
/ ?& @8 v: f! [6 q
//人名移动
1 p7 p8 T$ v1 W
function move(fbox, tbox) {
2 v- Z) p8 o) ]* C8 J6 l
var arrfbox = new array();
- s9 p- U! m' Q; p( m* Y3 n
var arrtbox = new array();
4 f6 ]3 Y& d1 a# Z
var arrlookup = new array();
2 m7 c; a. K5 ^) f: Y* U
var i;
# h. x3 F8 S4 X6 d2 R/ _: I& Y8 b6 y
for (i = 0; i < tbox.options.length; i++) {
- V( a7 U$ ~# G3 V" ~7 Y2 A
arrlookup[tbox.options
.text] = tbox.options
.value;
2 M* b# ?- `. r, d: [
arrtbox
= tbox.options
.text;
8 |: T: H, F% r! o
}
1 w1 X3 {$ U/ F4 [' A4 d7 [! |
var flength = 0;
. L7 Z2 K7 t$ w- ]
var tlength = arrtbox.length;
# h; r v+ w7 |( p
for(i = 0; i < fbox.options.length; i++) {
, ~8 s0 |) D* B6 M5 F
arrlookup[fbox.options
.text] = fbox.options
.value;
; E, [ {3 T2 U+ x, r" N9 t
if (fbox.options
.selected && fbox.options
.value != "") {
- E* K( D9 O, [; ~! l" c' u
arrtbox[tlength] = fbox.options
.text;
: x- g* D8 j! o: y# q, l& t8 ~( d4 o
tlength++;
- u4 _) x* ]9 P. w% t2 M5 M7 L
}
: f8 y. H7 M N# D; E: O/ B
else {
! N" M9 y# f! z* S+ V
arrfbox[flength] = fbox.options
.text;
/ R# O6 c/ f; s) h! X
flength++;
H" T+ z2 C$ Y4 S
}
, \; P0 l/ O. f4 A' P
}
, @+ i# ]. [- S& l% o
arrfbox.sort();
% Z S: d. C1 v/ h" u* s
arrtbox.sort();
5 m: T; _1 b" a U+ o
4 {. Y8 A1 o1 X8 o, e0 w. p
fbox.length = 0;
* b1 _5 n9 X- @
tbox.length = 0;
5 S/ t8 o# i4 a5 n. ?0 T
var c;
) N) `$ n7 \% l5 z4 X
for(c = 0; c < arrfbox.length; c++) {
& N5 X( \- _2 x4 A
var no = new option();
7 _7 y, j$ o ^; F& c
no.value = arrlookup[arrfbox[c]];
) m/ v5 {, i# l# w" R* v4 C- h
no.text = arrfbox[c];
# F* I0 @8 X& Y( [1 V' W
fbox[c] = no;
% ^# P+ I# _4 j9 W6 l1 l. Y" [! Z
}
) k! [. G% s$ Q, S$ r- c0 k
for(c = 0; c < arrtbox.length; c++) {
; i! \% v& _7 X- B
var no = new option();
% `* o& y; l1 I* @/ B& x
no.value = arrlookup[arrtbox[c]];
p6 F* E: w6 j* ~
no.text = arrtbox[c];
* a: g0 K6 t" x4 I! z$ _( o
tbox[c] = no;
! A& H- G8 S( ]3 x
}
9 s- H% x" {2 ^! J3 R# }( T
}
9 g! U; P- B G
</script>
0 l, H: f0 ~! g* H6 ?8 p
</body>
# G) Q$ I0 b' Y; _& g
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
