标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
( s* X# k, Q7 |( a
c pageencoding="gb2312"
3 h. k* a4 W8 J5 Y( }+ a* z
%>
l7 h0 \9 C* s* e- x
<style>
7 |+ ? A6 L1 r/ h
.f9{ font-size:9pt; }
6 \+ s: C- h. `( E' i
.bgc{ background-color:#aecaf9; color: #0033ff }
" k" p$ K H* Z! p4 I
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
" s3 z1 g/ |: }6 W
border-bottom: solid 1px #4e7dc1;
' w. d. P8 Q) M. c
border-left: solid 1px #aecaf9;
9 n( c" v: U9 Y1 S
border-right: solid 1px #5679bd;
' G9 X# m( m4 H4 i/ L
padding:1px;
0 N$ G u% c1 P* X$ y0 U& [8 G X
margin:0px;}
9 B/ {0 c+ \. q, ?- U( y
</style>
" e @$ c, B' v) X2 {
<script language="javascript">
. A9 D8 c% j; S
<!--
% r- y( u/ L& {% e- v: a. ^ p8 B
function rv()
9 a# D+ Z0 X1 N
{
8 D; I, u' O {! B: N# f
var val="";
5 p& ] h8 i4 C2 h2 u% B* j# Y) h
for(i=0;i<combo_box.list2.length;i++){
1 R2 b% ^1 S' \* g' I: z, N" q
val+=","+combo_box.list2
.value;
* P6 T3 @7 h; r: [: L$ l4 Q
}
8 D$ U K) s+ N2 o3 I
if(val.charat(0)==","){
" c$ Q9 d7 |, [3 L0 H; f, D$ r6 o
val=val.substr(1,val.length);
& f) X! K4 c Q) Z4 k3 I; x' \
}
4 H* o2 J v; o% r) y) p
opener.form1.frecname.value=val;
% m# s4 ^" R- s+ R. |- t5 \
self.close();
! l/ [/ R2 V. G( h5 }
}
, q: T# \% ^& s: K8 C# A- d
//-->
3 ?0 f R, y7 s( ? a
</script>
' e7 T. u+ J. z+ [' i! }1 ]' s G3 ]
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
/ L# F: K/ H5 L( l
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
* y& I- O @% T7 c0 B5 A( V6 `
<%
" F9 r& {9 p) Z5 z# N1 [
cdatasource ds=new cdatasource(); //数据联结bean实例
: h. q- o4 Q: A( `
java.sql.connection conn=ds.getconnection();
: U! q9 K" Y* V; ^' O% {
java.sql.statement stmt=null;
. K; G; B0 Q% F0 r" V9 d
java.sql.resultset rs=null;
0 [$ P9 G. t h8 z2 u0 A0 ?
cdatacheck dc=new cdatacheck();
; |& G3 b* U) P& _- n
%>
( a2 B* x* }0 a' |( m# Y
<%
9 G& r- e, }6 ]
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";
9 @9 }$ X9 `0 E6 R: A
stmt=conn.createstatement();
# g% c* D; Y/ g# s8 y* C5 A; ^) J! h
rs=stmt.executequery(sqlu);
1 j2 f% l& A2 V/ Y
%>
+ p- i/ D7 [. ?. o9 ~
<script language='javascript'>
6 x, z. x6 w+ C8 e/ l# e- r/ r) \- d
arr = new array();
# B( F* r, o) c7 K) |, ]
<% int temp=0;
" [: o/ N+ ~, {% q
while(rs.next())
8 a, C! V. e$ {* ~- O
{
: O+ v }: _9 n' u# \4 K" l( P
%>
3 G8 c/ y6 b$ j2 b+ M0 G
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
; A2 x& C$ ^& j. h
<%
1 u. N" m5 h+ k$ y0 W" Z: R
temp = temp + 1;
+ l- X p, {* }4 M" B2 R( p
}
( ~9 B) B$ B: `- X9 T
%>
) l. {: P( y0 D3 E u8 p+ n( t
temp=<%=temp%>;
+ L- U+ e ]5 |
function changelocation(id){
$ v+ ]( y) H1 n, G0 ?
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
; j& b; L0 C5 K- Z$ n) }% @! }
var i = 0;
" Z$ O) L/ _- b) F
document.combo_box.city.options[0]=new option('-------','');
/ B y. g! S1 |6 v# ~# H( U# s
for(i=0;i<temp;i++){
3 [2 u" v: P( Y5 |2 n; ]
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
. e4 a3 w; [4 b7 q
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
4 c: l1 |: D9 `
}
" c/ a7 i/ K2 R2 S- z
}
7 o; Z7 U" ^ M; P& {( p
}
9 |7 d& `( O* p
</script>
* W2 ~- q1 W- z- d# A+ _* u$ |
9 ^/ J- N# w7 A) e
<form name="combo_box">
' b8 ~, G8 R5 P: w
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
f: a7 g5 W' q+ a( s
<tr height="24">
9 c. ]1 o+ F! q
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
( v$ I- t- {( A' l2 @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
: i0 r1 s+ ~( F1 a0 U9 g! [: ]$ }
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
5 D/ Z4 L- Z0 K4 w! I6 \3 Q+ X, D. @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
% ]! P" t% ~' [3 M/ A7 g
</tr>
8 t& }: d) b6 {" c o- C
<tr>
" W4 B& [% e" _; D6 F
<td>
' }: n9 p: b |7 B7 y
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
5 `- ]3 }- H( T( }
<option value="0">请选择部门 ---></option>
9 @. z0 D' f; |! S( U7 V$ P/ a
<%
. c. d8 |7 l( l' n3 g4 x% f# e
string sqld="select * from tdept";
2 v5 ~' L6 y$ {. q2 z: b
stmt=conn.createstatement();
* C' B+ w! u T
rs=stmt.executequery(sqld);
a3 P: y3 q1 Y" a6 `" \
while(rs.next())
$ Q2 Z! P) x! S& K2 Y) n3 G: f0 x
{
0 X. q/ t; f" d4 i' q; G
%>
1 W8 X& z6 u; C
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
" E. D, W* P8 M$ @, |3 U$ I7 I
<%
: [1 [1 E _$ @# c- {
}
7 |& v& Z! _( M; C( D
%>
# v2 y5 @/ k& E' U& z' |+ d
</select>
6 D' w' f0 a) O$ N$ p* B
</td>
8 Z; n, z8 ]! x( f
<td>
. T5 `: u! H/ H$ W% x$ m& T
<select multiple id=city style="width:150;height:200" class="bgc">
# E' } Q8 o+ d$ e* ?% s1 G* V( X
</select>
4 k6 p3 M. R# P7 G0 C
</td>
0 V& F5 P1 |9 W+ y: m
<td nowrap align="center" class="bgc">
* d q9 b& |) C7 U: L9 x7 A7 D
<input type="button" value="<<" class="buttons">
/ }5 q3 X' }# u2 D" i# Z
<input type="button" value=">>" class="buttons">
& j7 i8 Y7 P4 ]) A( J5 ^
</td>
3 b& t5 d% I# J3 j4 ?
<td>
) e( ~! H% I9 O- T
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
8 q/ L; w5 L1 W
</select>
* @) n" ~9 x. M* X$ d* j5 a; |
</td>
4 k6 Q# I) x7 a' u b* l1 j2 j
</tr>
8 D) l n2 V8 K s/ s- ~
<tr class="bgc">
# M3 Y( l" U% C! K3 ?
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
$ q( \/ x y9 Z5 P0 w4 g
</tr>
7 `! B1 \# K, S, r: I, F
</table>
1 ^2 w: \) e w" N: j& N/ x+ h6 f
</form>
, ]. D( _- @; p7 O
<script language="javascript">
1 Q( \( p8 ~; e/ w+ e4 o
//人名移动
* t1 t9 h1 d( r. A3 e9 p+ k- c( C9 x
function move(fbox, tbox) {
. ~% H! V: n) e- Z$ p& M
var arrfbox = new array();
6 O c; C7 D' S
var arrtbox = new array();
& y( E: |5 X/ V- J. [( }% K
var arrlookup = new array();
( ]0 I! C7 [% v$ P3 O8 E9 t
var i;
5 i" g% R+ p8 ]. }
for (i = 0; i < tbox.options.length; i++) {
/ {. y% o4 Q9 t; q1 k
arrlookup[tbox.options
.text] = tbox.options
.value;
1 Z8 a2 z/ r* T. V
arrtbox
= tbox.options
.text;
, g7 q8 V% J6 |" F6 ~
}
. F1 ~8 i1 T' v6 I
var flength = 0;
p; s/ J8 v& g
var tlength = arrtbox.length;
1 o' Y4 g+ }( t+ Z
for(i = 0; i < fbox.options.length; i++) {
8 b6 ?, Q% {5 J0 ~0 a7 J$ \5 R6 c
arrlookup[fbox.options
.text] = fbox.options
.value;
& U1 S4 j% G% j* i8 F `0 Y
if (fbox.options
.selected && fbox.options
.value != "") {
6 C. v6 c: Q" M- O
arrtbox[tlength] = fbox.options
.text;
( r8 X( k+ S7 d
tlength++;
& [' L# {* `0 h8 P# {9 O
}
* m, i5 K+ d$ j
else {
" `% R6 M9 J$ A
arrfbox[flength] = fbox.options
.text;
# C2 X1 L& |1 L l& i
flength++;
( B6 L& P8 A9 T" e! {, B6 t9 G
}
5 I! {( F6 x, u6 Y
}
8 c: q% I) I3 w3 }9 O8 e- w) j
arrfbox.sort();
* Z7 J, Y9 w, r6 \& [
arrtbox.sort();
6 h$ D8 B7 Z) T. U2 b4 N6 L( o
0 K* v6 n7 w: o# `5 W5 [
fbox.length = 0;
5 G+ S9 g* y' w6 w1 A8 ?0 M
tbox.length = 0;
9 K2 v6 h4 C# G# p% C+ F
var c;
$ G+ ?! c4 P( O
for(c = 0; c < arrfbox.length; c++) {
2 f0 `/ r/ a$ v
var no = new option();
/ c* M: h' q* N8 f2 o
no.value = arrlookup[arrfbox[c]];
: m! t8 n6 `! C* ?- N& H
no.text = arrfbox[c];
6 C( [/ V0 P2 T
fbox[c] = no;
0 m& d- I' j) e" {& c2 S# |1 p- [
}
5 I- c7 z( M* g( w
for(c = 0; c < arrtbox.length; c++) {
/ F. A1 O% g3 ]" ^3 _! e7 }: K
var no = new option();
* ^( Y0 B- ^, w0 C
no.value = arrlookup[arrtbox[c]];
3 _+ j! I; J/ J# [" {, ~. V+ `, O
no.text = arrtbox[c];
& J& ^; @; I% T8 z7 I. l7 _
tbox[c] = no;
" _) O q- l U( l$ b0 ]
}
W% w% k: T; U- A; `" R# c
}
& g' X" t, o! a; I# m
</script>
. K( e3 W% C6 F3 H* F+ q
</body>
" k! X }* J' p6 f6 A) }/ M+ I
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
