标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
; J3 r- s! V( R' B/ w' s
c pageencoding="gb2312"
! Q# U- T9 [# y8 s5 @
%>
2 ^. _% M# X- C0 I3 N" V
<style>
& v- ~% I$ y- G
.f9{ font-size:9pt; }
5 z, V+ Y. g4 U* @; t
.bgc{ background-color:#aecaf9; color: #0033ff }
7 P8 _( h8 Q9 p9 |( f
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
5 e# p7 h( Z* G
border-bottom: solid 1px #4e7dc1;
( P8 E& h8 V/ h* ^( l
border-left: solid 1px #aecaf9;
: c8 k" }4 D2 w! Y
border-right: solid 1px #5679bd;
0 o x* A9 V* _( n# D- Y, x
padding:1px;
4 h0 i# G+ N& b# ]
margin:0px;}
2 s! P$ W& x! _& N/ }6 s
</style>
: k$ |" o: A, Z, D
<script language="javascript">
. I$ U5 M# F5 r" h
<!--
! s# v# k5 C7 ~7 P$ O m& c5 A
function rv()
8 @& D% w- W, g3 I0 T) _1 p! @
{
x5 O) W, M! v1 ]3 x8 V- F- Y
var val="";
0 C% y( ^) m9 b- t6 F. U
for(i=0;i<combo_box.list2.length;i++){
# e$ f1 _) K9 E% }8 Z( m4 M
val+=","+combo_box.list2
.value;
" M( ]% T" R( V/ z
}
& A% }+ D' Z* F4 }# s" Q
if(val.charat(0)==","){
3 `' `) {! E0 v- e
val=val.substr(1,val.length);
K2 x( E7 Z8 x& t& c9 r8 E3 {
}
, l& U* c: z6 w! ]
opener.form1.frecname.value=val;
% K( v2 J/ o# @7 W. D
self.close();
* `" m/ f/ U; {5 T- ?
}
1 [/ V# D/ I7 p% }; a
//-->
, y- m* H# r2 N/ R! X* F' D+ l
</script>
( R q; W2 p$ O# K, N
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
( x+ z8 K( l$ J
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
7 Y& e4 B5 n* R, g( t+ c3 M
<%
. g+ H+ |1 B$ ?: B9 h
cdatasource ds=new cdatasource(); //数据联结bean实例
+ N _& k! u5 ^" ~
java.sql.connection conn=ds.getconnection();
u3 E/ d. o1 l' h* A2 |
java.sql.statement stmt=null;
/ j, I6 L* ]6 z2 Y- _6 A
java.sql.resultset rs=null;
, D6 ^' h& I' Y7 Y
cdatacheck dc=new cdatacheck();
0 n9 K+ M% c: T9 t
%>
9 s4 j. r: d7 s( m- E, F1 N/ Q9 T1 Y
<%
8 ^' C0 z$ v% W5 A# K1 R) A" r
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";
, d! e' e$ f. K& z* [7 m' O6 l
stmt=conn.createstatement();
: B% ~8 q5 g. h. D" x
rs=stmt.executequery(sqlu);
8 E- d- J4 \& o6 n7 w
%>
6 v2 P2 A. D1 I" i: c
<script language='javascript'>
, W. W1 g3 o' i0 ]2 t
arr = new array();
! n. b1 e2 Z0 j* T9 c" k
<% int temp=0;
3 m; t$ f5 C! D* A5 N* H- u
while(rs.next())
7 C8 @3 h% _- R
{
$ o( J1 Y5 S- p9 _
%>
6 G* V5 O; ^' W ^7 `: G9 a
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
# J' z4 r3 Z3 W$ Z* v
<%
% i" {3 c$ b# `
temp = temp + 1;
, j( n9 H" J, l6 Y# k- r
}
* R3 y" K$ s: F2 s/ {5 X9 `) P- G) t& O% k+ @
%>
& T8 G1 S: d& o$ w# c, G3 n: m" Q
temp=<%=temp%>;
% S& y& S1 B; L4 n) r6 k1 ~: |
function changelocation(id){
1 m0 k+ [0 g' G$ C$ W
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
$ [. J! @2 n1 h/ W+ d
var i = 0;
/ N' ~# X i+ M6 z* L) c
document.combo_box.city.options[0]=new option('-------','');
: l' m: [7 e+ o$ U
for(i=0;i<temp;i++){
' y& Y/ Q3 g& P$ }
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
9 `6 L# ]3 G G
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
' `1 ?! h% ^2 H3 b# e( u& Q
}
. Y# p: Y$ O% c/ v2 f
}
' }; g. a! m" `/ f7 X0 F
}
# }$ d# P7 w r" u, ?
</script>
; [/ J0 q7 m5 j w
" U& U6 }' K" E# T# P7 N: Y+ h
<form name="combo_box">
7 T% j$ M5 S$ j4 U
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
; T( D# T/ n* Q; r5 G
<tr height="24">
+ K: z1 M, f0 I
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
3 _* ?$ @% @7 s: |3 i3 L
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
6 m5 x/ x" m! ]- C1 o) d
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
0 u. y% m% ^4 \/ n4 M3 U$ y0 G
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
: k& q2 q/ ^4 A* _& d7 a# t
</tr>
3 ?( s- a Z! E+ F2 N* a7 D, i
<tr>
3 l7 r5 R0 T) t& s( P- p) i8 E+ C; o
<td>
0 I- ?% ^ V4 m- u% w
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
1 }: `! P+ [, L8 @) k8 N. @
<option value="0">请选择部门 ---></option>
1 f7 `5 X9 u, {% M- Z; G( R
<%
% I2 @" O0 r& G6 X' o" b! C' G
string sqld="select * from tdept";
5 z o0 W0 U. ~
stmt=conn.createstatement();
' \3 M- O- J5 N' r( b, C( I
rs=stmt.executequery(sqld);
2 t E3 m7 H1 D9 v
while(rs.next())
, |; `4 f$ i0 g/ R' U6 [
{
1 e1 l& {8 B' ]4 H
%>
0 V; e9 u) A4 c) s$ c
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
8 v6 D6 H( }; l8 w* I' _, i9 C, q
<%
) b: A$ q# w; U2 c% {, B
}
. r8 I' U8 \, S, B- y( Y
%>
3 F, f- K5 Z \# @
</select>
0 u: c& ~9 C# s9 ?, E6 c
</td>
5 |; d: K% F" o- }& I
<td>
3 _- ?, `& M; E( H
<select multiple id=city style="width:150;height:200" class="bgc">
& J2 ~4 m' P+ h$ O
</select>
1 _4 y/ c+ @9 Z, n+ d* o6 l
</td>
7 K& e' |& A* R, l3 Q
<td nowrap align="center" class="bgc">
8 F+ K! y( p Z3 |
<input type="button" value="<<" class="buttons">
, e1 m1 S- ^7 E0 P
<input type="button" value=">>" class="buttons">
4 n6 b" W( J8 r, J( V; X7 z
</td>
* _, p( k& A4 ]* x
<td>
$ u* c3 }. y) {+ r8 T
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
: K( y$ m: w# r0 ]8 x X9 R
</select>
, N; N0 x: F: M7 w2 {! r
</td>
9 y% s$ f1 _. t
</tr>
3 B- n$ A9 l. F/ S" M4 f
<tr class="bgc">
9 ^- E' R# i; z4 g2 v
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
: f+ k- E8 `& C3 X: b- f
</tr>
, K2 M& J7 G6 c \ }
</table>
! p# P% D' Y; D9 @
</form>
$ ]+ J( D E3 D' i x
<script language="javascript">
- j+ V E5 ]2 W& x, z( z u
//人名移动
1 H7 N4 K# f( c, `2 h+ R
function move(fbox, tbox) {
9 c( ~. t! E' M; k5 K, J
var arrfbox = new array();
@: m, n2 x6 h# p4 k
var arrtbox = new array();
?& w0 f7 j2 ^* t7 t/ v
var arrlookup = new array();
/ I; C/ f* |- g& R1 ^
var i;
+ k, Q7 q* v( R: I
for (i = 0; i < tbox.options.length; i++) {
2 \- k H' c( |# F. h3 g
arrlookup[tbox.options
.text] = tbox.options
.value;
7 B2 h0 r) P2 n0 H. q
arrtbox
= tbox.options
.text;
, m! J) Y7 g8 F9 {! b/ x. \+ b
}
5 \1 M1 E, p4 Z6 c, Q# K
var flength = 0;
1 | x% {" n/ C, l! N. @% S+ m
var tlength = arrtbox.length;
1 R1 t! k+ j- [) r# @+ z
for(i = 0; i < fbox.options.length; i++) {
; z8 t' q/ o8 c6 o* E
arrlookup[fbox.options
.text] = fbox.options
.value;
9 G, ?+ ] A w5 b) t3 U. j
if (fbox.options
.selected && fbox.options
.value != "") {
& K: s0 E8 V5 p( n- D1 w0 R! v( E
arrtbox[tlength] = fbox.options
.text;
; j- t, c& K4 r' o
tlength++;
! e8 }8 _; D& \9 S5 o
}
) T( F% c' ?8 b. S1 o
else {
3 Y" `1 e, D5 D# p8 C7 `6 u, |
arrfbox[flength] = fbox.options
.text;
9 J2 b \! @2 y' i' D3 X; _( B3 {
flength++;
' X9 X9 b' n( K, ~; ]2 x7 z
}
) i. {8 c( w3 d- ^6 E
}
; S/ ?' j- W9 j
arrfbox.sort();
3 x3 |& u8 A) F8 r4 H4 a
arrtbox.sort();
: S& D V) U* x& G7 m: V5 E
2 D1 k4 X; F' U+ A; L
fbox.length = 0;
. j$ R5 V" W! s# f
tbox.length = 0;
! G' y. ?( J8 j$ B2 h) i- F
var c;
5 H' Y; v" v) H' l
for(c = 0; c < arrfbox.length; c++) {
5 J6 n& ?# f" E6 E' N
var no = new option();
6 b# c& |& k9 l, i+ L0 q7 D
no.value = arrlookup[arrfbox[c]];
0 D% t: @8 U7 e) h- u
no.text = arrfbox[c];
/ e# ^( ?6 A/ h! n/ u
fbox[c] = no;
) a% W- D# Q& Z W. y& d/ j$ T( C! b" N. F
}
& h8 `8 k0 Z$ n Q6 |% C- i( m* X
for(c = 0; c < arrtbox.length; c++) {
" W3 ?5 @4 T: s# B' s+ T+ X% e
var no = new option();
+ b: J* M2 f' t3 A
no.value = arrlookup[arrtbox[c]];
$ ] ^5 K' W! a% X, X
no.text = arrtbox[c];
* [6 @2 ~& [' y+ y, h" S: }, @# r5 u
tbox[c] = no;
% u) k0 `8 A7 h- K
}
) y/ _, s, b1 m- A D
}
8 l9 h/ e/ M( p6 A
</script>
! L- W) ~$ Z4 V( u0 `- o
</body>
5 j4 t, C/ a* {) e
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
