标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
' w4 W" }0 P& S c2 _7 `
c pageencoding="gb2312"
; T7 Q2 p+ i, J; U. @: w) A
%>
4 y# k4 [! U( t4 f1 \% i
<style>
4 W# } E- m' S0 n
.f9{ font-size:9pt; }
% _ G/ D& ~# G& g& i
.bgc{ background-color:#aecaf9; color: #0033ff }
) D! J9 m6 q, M" d2 X8 H
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
9 [ V. X. s5 t& L9 a
border-bottom: solid 1px #4e7dc1;
1 k$ } J; g8 P$ O$ y' T2 e
border-left: solid 1px #aecaf9;
d' L7 ^- ^( n' s+ q
border-right: solid 1px #5679bd;
( N' f7 ? |2 T/ m4 r& _) p7 b
padding:1px;
8 `/ K, r- {) L' E$ S/ ?9 V
margin:0px;}
1 k5 g, `7 \9 }! Z8 t. j$ Q
</style>
' R; H8 c, S1 `7 v
<script language="javascript">
' W, m1 Z: M$ M8 e: V' ]1 d# u
<!--
4 J) `- t2 q% _ O. i& F
function rv()
# l) ?7 V: |+ J. o1 f, F
{
- m$ O) h2 n6 Q4 e
var val="";
# E& r( u; ]0 k5 }) T0 U
for(i=0;i<combo_box.list2.length;i++){
, a1 u* V) C! J, T( @4 v
val+=","+combo_box.list2
.value;
. \3 r/ x0 [3 Y. o ^* K4 E G
}
7 c; H+ f1 t" l9 Y( l
if(val.charat(0)==","){
0 X1 Z! K! w7 S6 i I" A
val=val.substr(1,val.length);
- M( u: U6 s( _; Y: `; h, J
}
( t+ C: ?# t1 o4 E! A$ U* |2 o1 P
opener.form1.frecname.value=val;
% w4 H$ t! x1 ^9 n( @8 G
self.close();
D' Y1 y$ _1 s. }( i7 u
}
W" D- z* Y4 H- S
//-->
5 \0 N% f1 Q1 E% S
</script>
$ U8 Y+ z! p; C1 r$ E
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
3 i0 `4 a v# L7 y0 [
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
; @( | T4 N. j
<%
! V$ o9 P( b( T5 `
cdatasource ds=new cdatasource(); //数据联结bean实例
$ D, c5 i A$ k( D% `% G7 @
java.sql.connection conn=ds.getconnection();
$ S' w3 D) p$ e( b- n5 C
java.sql.statement stmt=null;
# `1 y8 J4 \% A5 G0 G) t$ S# G8 m
java.sql.resultset rs=null;
: D7 H! n2 c" `1 B
cdatacheck dc=new cdatacheck();
: J4 a6 h2 R) g" f) D/ g4 C: _
%>
1 e2 B7 L Q3 n. \7 [4 h# o2 |
<%
Y9 Z G$ N+ \2 C4 L. ?8 L) _
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";
$ N4 V. ^9 V8 R3 C. _1 q4 I
stmt=conn.createstatement();
& a z/ I( ~) g2 J
rs=stmt.executequery(sqlu);
9 |! F" z6 e- y0 ]
%>
d7 P+ e2 o4 ?) C9 e
<script language='javascript'>
9 Q5 T; r6 {. C* m- O# Z
arr = new array();
0 k, t- t# E% b# e- y
<% int temp=0;
$ M7 S0 ]/ j, o( n
while(rs.next())
: n X% I: {( ~( f8 D. Z8 Q* f. l
{
" r3 y" B1 W. ^ l/ S
%>
* O2 K' y* \# n. _. M2 g1 m$ B7 x
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
6 s5 ]6 i8 v C* ?: T, F
<%
! l% l. x3 w. U) `$ \0 s
temp = temp + 1;
& {) D, s5 ~5 _& N: _# \
}
; K) U8 y( P- w; ?+ ~
%>
% n9 @7 s- g. g: d5 R4 t# I
temp=<%=temp%>;
2 @. q! f4 P3 s5 I& v
function changelocation(id){
3 r, a* E" o7 i# L* o, p3 |
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
9 [' r8 Y6 W# M; z% Z4 L5 R
var i = 0;
- E, E7 H% k: @& L8 n
document.combo_box.city.options[0]=new option('-------','');
- n" [% k* ~7 w1 F+ [; ?/ ~
for(i=0;i<temp;i++){
! a. D8 e: {2 D# j
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
/ A, \$ I. B0 `
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
6 i; X) S6 U7 C" v
}
) S$ L1 F7 ~% w% G- ?0 e- L
}
$ r5 @& G2 p8 \9 b" B; }% \0 C
}
% m% Y) y) r$ [! L( t
</script>
5 O5 _8 o* Z5 B+ U
) s7 l7 k( r- L
<form name="combo_box">
# K& f j, N/ Q [2 l6 A! q
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
. i6 s/ E4 V* k/ t; C6 E0 R) y
<tr height="24">
$ ~. t! A3 l P) e" {# @* f) z! Z
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
1 H8 e+ ]6 p# l' x2 j1 m" t
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
4 s& ^; g7 ?( P& A* X2 F
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
$ U9 y" W, a- }7 b
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
- p, C0 U8 I+ n# K
</tr>
) E- ~3 r, D$ c. y# }4 Q* t
<tr>
. R1 }8 z! v4 d
<td>
$ q6 {) F9 _& r+ k) ]; [
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
. `7 v* P- ]- r$ Y: K9 E- ~5 ^
<option value="0">请选择部门 ---></option>
. P3 j, h" j9 B
<%
, M Q5 A) Z9 y
string sqld="select * from tdept";
4 k) ]2 z. \( d
stmt=conn.createstatement();
( O, v" {& Y7 r" c+ _
rs=stmt.executequery(sqld);
; x& t9 ~$ @; V9 e
while(rs.next())
( L% e6 W6 }2 E; i* @; b
{
+ I3 [( G2 m' [, u
%>
1 G: r" C7 z+ i/ l2 |# f: ?! ^
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
* | O0 ?( S7 P7 i
<%
$ N! S' p$ x6 K0 Q* t
}
) E+ B- _' w9 _1 w7 K, X5 T- R
%>
# _- F, o$ \1 u8 N1 S
</select>
7 o2 O( z% a: n+ }+ g
</td>
( W N6 L3 l& o1 n) m8 G, ^
<td>
9 T) q! w9 k& g/ W8 t
<select multiple id=city style="width:150;height:200" class="bgc">
6 A/ w! T; o* N0 `- d- j! W. I
</select>
! s# F2 j h$ T
</td>
9 j( C" s# ?5 P7 q7 _+ g5 ]6 R2 g7 x
<td nowrap align="center" class="bgc">
1 G. Q4 k }8 @- S- [3 Z4 ]
<input type="button" value="<<" class="buttons">
/ N+ a9 \6 m2 m5 r5 q' ~+ h/ G% n
<input type="button" value=">>" class="buttons">
+ ^4 X& P3 p8 `# P- Q
</td>
+ K! q* b! y: j3 s0 U
<td>
3 ~* U1 }0 W( j8 g$ V
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
4 S# k- I- t$ h6 Z: K% Y0 _5 T
</select>
' b8 b! k( d3 x3 L6 a
</td>
' F. l( i8 g% U, ?) h
</tr>
, q8 T" y" c4 c
<tr class="bgc">
9 B8 p" h( J0 D! N ] f
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
7 Z: u: d3 H4 W7 f/ o: \' L- Y
</tr>
9 T R2 A5 t. a% y
</table>
; M$ J8 w' @( A4 ~
</form>
2 T# {$ [& y3 D" N- d/ S& x: l; z, b
<script language="javascript">
7 s- s; d. g/ X8 n5 O
//人名移动
~5 L! v, Y- V
function move(fbox, tbox) {
6 b9 T, x) J8 q' T- N
var arrfbox = new array();
8 X5 {- d+ i+ L, h
var arrtbox = new array();
! L. L* n' O- c T8 Z
var arrlookup = new array();
P! N& H7 n! O) j
var i;
+ v8 D) y k, O+ A8 M: h# b
for (i = 0; i < tbox.options.length; i++) {
# f+ }! N6 z7 `+ r
arrlookup[tbox.options
.text] = tbox.options
.value;
2 l5 a' f4 [% ~4 ?1 e3 R' c/ D: o) E; ?
arrtbox
= tbox.options
.text;
* |- G& b8 R) J# h7 T2 g: x
}
. c% v1 p4 C1 e5 ]/ b$ Q r# r
var flength = 0;
$ {' W) _" X. l% ~
var tlength = arrtbox.length;
" U- ^1 a, n9 G. |( W+ J
for(i = 0; i < fbox.options.length; i++) {
, o" U( `9 o; `
arrlookup[fbox.options
.text] = fbox.options
.value;
' R; y. P. S7 k0 r% h# c
if (fbox.options
.selected && fbox.options
.value != "") {
o3 t2 s% ?" X* o* Q$ u: [7 R
arrtbox[tlength] = fbox.options
.text;
% Y' y" L; N2 _9 m% N7 j; i
tlength++;
" h0 f a9 X) f: `$ ^
}
8 B2 E- C0 F& O/ _: j
else {
: t6 E" i" N& l4 [' l" ]& ~( Z7 R
arrfbox[flength] = fbox.options
.text;
) M; t4 A8 h, S) h
flength++;
" V% ^; G A3 x3 g2 {
}
- h! @4 C' J0 u% z- E- P
}
. K8 O- Y# A2 o8 P0 n% {
arrfbox.sort();
1 Z0 I3 o v& n9 ^# K
arrtbox.sort();
; D2 ^5 `9 q% g, V/ {+ b M& X
3 r$ Z1 z# E! d9 L) m$ g
fbox.length = 0;
" o, z1 F U! i
tbox.length = 0;
/ L) A( L R; ]8 J5 a V' `
var c;
7 \' p5 e: A/ ~/ G3 o% w+ G6 v! p
for(c = 0; c < arrfbox.length; c++) {
* l4 \- o- c1 E3 o2 z
var no = new option();
9 M1 L8 I1 e0 D+ g3 n9 D
no.value = arrlookup[arrfbox[c]];
3 W' d6 }/ T; r8 Q3 @, B8 z: m/ f
no.text = arrfbox[c];
( C% y8 E3 l( G5 z1 G% S
fbox[c] = no;
8 F+ ^2 x- _8 h5 Y# }1 y, R: {
}
: `3 o. J$ q; m& l) ]9 k, K
for(c = 0; c < arrtbox.length; c++) {
I0 W$ o) R+ F% x
var no = new option();
, O0 ?4 s& L6 ~+ W0 b, p2 a
no.value = arrlookup[arrtbox[c]];
, }, \3 i3 y O
no.text = arrtbox[c];
6 T* i& d( }0 c/ Q
tbox[c] = no;
1 b5 o+ \8 o4 c9 U
}
2 d2 O$ l C1 Y- f# }9 |5 o/ V1 l
}
! f7 B" z8 _) e
</script>
6 s, C+ v. D3 u1 Q5 n) l
</body>
; Y! ?' h) `% T4 } Y$ F/ Z
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
