标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
% Y, F- l5 |% U
c pageencoding="gb2312"
3 ?3 @8 ?: K4 | I6 z4 X: Z
%>
& G; P5 H' O8 _- B/ E
<style>
$ u! s2 q( V9 o* C' B7 C
.f9{ font-size:9pt; }
6 r* V0 [ ~4 f7 \
.bgc{ background-color:#aecaf9; color: #0033ff }
3 L! u8 l, |( v( D: o( Z
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
* F$ v/ T7 P& n3 N! i) n8 e
border-bottom: solid 1px #4e7dc1;
& }1 Y9 W2 t* ^4 ~2 R
border-left: solid 1px #aecaf9;
( @7 P# H5 h9 w2 F
border-right: solid 1px #5679bd;
/ C- z$ l( F9 }9 Z9 b
padding:1px;
* W6 i$ F) k8 Y
margin:0px;}
, |5 S J) [# p# y" k8 ]0 e! i$ I
</style>
, b. p! U' L( p& c6 i8 D% F
<script language="javascript">
0 P- {0 g6 }0 I) n c
<!--
: c8 V6 b9 n: K! _% y
function rv()
* \) U! Q" z5 Y. V
{
0 Z0 N2 s8 m% V# u
var val="";
+ x0 ^& m( ^) w- i
for(i=0;i<combo_box.list2.length;i++){
/ z9 x' [! s: f6 F/ i6 B b
val+=","+combo_box.list2
.value;
3 t7 g5 L+ _7 k/ l. s& L
}
4 m, P0 W- g( S2 I
if(val.charat(0)==","){
/ i% f9 ^# W4 k, L0 t- {
val=val.substr(1,val.length);
$ R7 Y( d+ J4 J9 Y. c
}
7 e& r. r0 f* n; W. M$ x( s' b
opener.form1.frecname.value=val;
) L6 o7 G; z/ U% b1 ~9 ] ?+ i/ k
self.close();
. R4 N0 a) z# X: _
}
' ^* a, }) ]+ |' }- N
//-->
( W0 ]8 B5 m& X) Z! t
</script>
/ X( G) _. h N4 J8 N' B
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
, d. i- J3 O. n% W# V
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
1 c" o2 s2 g/ e/ l- M$ D
<%
9 P$ X. Q' }3 R; C) C" n+ P
cdatasource ds=new cdatasource(); //数据联结bean实例
\0 k( v! w6 p
java.sql.connection conn=ds.getconnection();
/ F1 D8 P7 x( E& Y- S
java.sql.statement stmt=null;
9 J* O& ~1 q: r' l) x5 l$ z
java.sql.resultset rs=null;
) T/ g/ c( Q! t7 \. W+ z
cdatacheck dc=new cdatacheck();
& ]. }( d8 S7 Y0 X5 s
%>
: r3 I. G+ b! A1 Y- ` Q
<%
/ B N* s- I! g: |: w9 g" G
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";
" C! d; b2 N! N
stmt=conn.createstatement();
5 F1 m0 Q) z8 Z6 T3 \1 d' c
rs=stmt.executequery(sqlu);
- u- Y8 Q1 [& o$ K- P/ U( ?
%>
" E8 o/ t W5 M
<script language='javascript'>
) ~( v. V+ K8 E2 s; m; E6 ~1 s; y
arr = new array();
4 G- [4 x' d" C/ N4 `
<% int temp=0;
. z2 i. c2 ?! b3 P4 J5 c& S0 `7 _9 y& ]1 u
while(rs.next())
# j3 X- i3 c2 l9 D8 p
{
6 j( N* _1 R# G& _1 K
%>
" `% @ g1 E% N2 y' [" B, Z) G8 Z; s
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
: a5 d0 Z& N6 u1 T+ b
<%
/ V; w* u8 V8 f, z S
temp = temp + 1;
/ }# B5 D6 B$ a0 z0 H) {
}
5 z/ ]& g% K- g$ C% W2 M1 e
%>
9 E5 u' H' ?) ~2 Z% u) t1 m
temp=<%=temp%>;
4 e; Y3 k+ \% V; f! X
function changelocation(id){
0 c. o, x: v% S7 f
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
/ l; ?# f; A6 Q4 a4 r
var i = 0;
+ t0 X; v; @7 N! `- L5 I
document.combo_box.city.options[0]=new option('-------','');
3 V7 a# b) E) |$ l# f
for(i=0;i<temp;i++){
~ p& y1 Y" k9 B* c
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
8 t4 }: k6 G+ R, ^% e2 ^
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
# l$ X, C! ]+ t6 r$ J) k; ~* o% Q
}
8 E2 t$ t1 c B9 T1 U
}
o) _0 F: S/ P0 ]9 A4 M
}
( X5 a6 u7 s& C5 G$ a% ]
</script>
* W; \" |: i; c* W9 G; R% L
9 G8 Y/ d3 w8 e+ r$ o0 s# X( k2 @
<form name="combo_box">
- i- _8 F7 I! w* V
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
1 ?) {8 o0 I$ B( V7 Q2 }
<tr height="24">
( O0 A: W$ H4 [9 S t/ F0 @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
! O3 m! V2 B! B2 [8 k: T
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
, y9 K& o" b* I6 `- W% x$ j p
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
, t4 y. r' Y, h. [; y" g- L K
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
; b" P' j0 w* Y" R
</tr>
8 Y- |! W2 R$ v+ _% `1 g
<tr>
! v+ }) x& _5 H$ W
<td>
9 u" H# ?. B: E/ u5 c! _) ^
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
9 i4 k0 V3 `4 F
<option value="0">请选择部门 ---></option>
9 H+ ]" c! Z# ~, B
<%
. ~* U' ^& w3 |
string sqld="select * from tdept";
' a% h. w; x9 ]
stmt=conn.createstatement();
$ R1 N" m' J" N$ W: S* G
rs=stmt.executequery(sqld);
1 u+ s- c9 s, g, Z- y& K* B6 L
while(rs.next())
" t1 j0 I5 i5 Q
{
8 T2 {& x( {! k6 Y# X
%>
+ S9 s* ^6 y( D, ?) B
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
" F! r, w, _/ x" i( }
<%
+ G$ S' u/ F) g
}
5 p, U$ F) k/ X1 [
%>
( P4 l+ T8 U$ J: {, J
</select>
7 Q, U: g+ O. s3 G) j0 H
</td>
# q' V. u x Y
<td>
+ N' W& e* @# t& ?7 r: \, Y0 \- Y4 ~
<select multiple id=city style="width:150;height:200" class="bgc">
/ F ]1 O d, [% \$ q
</select>
, {7 B# t2 }" y2 N s
</td>
2 d) q2 v" f2 k! W9 U: v X) S8 Q# Q
<td nowrap align="center" class="bgc">
( e" q2 @& d7 O, y
<input type="button" value="<<" class="buttons">
2 h1 j [* l5 j/ q; t( A
<input type="button" value=">>" class="buttons">
" ]2 }0 D/ c! h4 z9 R& ~0 n$ i% |
</td>
+ V3 Z; n0 Z. i( c9 `5 l3 n
<td>
8 `7 I1 W! U6 _! u$ u
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
, p5 L! W) m+ A
</select>
* H2 Y8 b% E4 Z# n
</td>
1 L2 ~. \. p( {# K$ A
</tr>
6 v: H2 W& X g
<tr class="bgc">
: N: }+ B/ R! {0 K5 u) E. z
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
0 W8 c8 r8 ?) [
</tr>
2 O y' J6 z" u: P& q
</table>
. c( V* x( l: a+ K1 N- g. P. \9 L! e
</form>
+ k! a S: |: o) Z" z& B- K
<script language="javascript">
* Z5 x6 d: g& g+ o* H
//人名移动
. D; o+ |' J" s( v
function move(fbox, tbox) {
( S4 U+ B8 T, u" _) K
var arrfbox = new array();
6 B1 n, B, `1 Z' }
var arrtbox = new array();
4 G: l/ T! p% E7 B/ u2 v
var arrlookup = new array();
5 d' Z) S" }0 @& }. g1 \1 n$ f
var i;
$ C& U3 C+ Z) h0 T" j; B
for (i = 0; i < tbox.options.length; i++) {
; }/ ]" k+ j8 b: U% I
arrlookup[tbox.options
.text] = tbox.options
.value;
4 W5 S5 n R3 h S( c% u4 u4 ~6 [) Q
arrtbox
= tbox.options
.text;
. g6 S+ j% U7 p$ r+ A
}
: w, } d. X$ C' M
var flength = 0;
n* x% f+ s n2 Y% @: O1 z0 |
var tlength = arrtbox.length;
: \4 U- _0 ^' @& z
for(i = 0; i < fbox.options.length; i++) {
4 N$ F q0 E: a$ }! m1 A2 [
arrlookup[fbox.options
.text] = fbox.options
.value;
& _2 M( ]0 M/ R
if (fbox.options
.selected && fbox.options
.value != "") {
Y& h- u2 H* @: I* r2 [' X
arrtbox[tlength] = fbox.options
.text;
7 X# J- Z0 x: f# @8 |$ R$ C
tlength++;
1 i) d' E$ i: r3 w: r
}
3 `9 q0 h1 P6 j) C/ J
else {
6 s5 e% j" }% ~# V, \1 J
arrfbox[flength] = fbox.options
.text;
9 V' T. z$ `8 T" ~" ~4 D# {: O
flength++;
' C8 q: ]" m/ F7 s6 Y
}
5 w9 p, }* y- G+ J6 x
}
0 B" x6 S @# ^6 Z \1 Z6 B
arrfbox.sort();
, @6 M3 H. t, D' j2 a
arrtbox.sort();
! o# q4 n& B4 ] G. K! [( a: L
v1 C+ e& N- [& v# R
fbox.length = 0;
: D, d( U, Z; @# U `5 A; e6 Q
tbox.length = 0;
! l# N3 r) |! \ `
var c;
# k- B7 U0 X: h9 Q1 h! s6 e$ l1 C
for(c = 0; c < arrfbox.length; c++) {
- V K4 b3 M" G
var no = new option();
# x) ^6 n; H( p$ }1 Y8 _4 J
no.value = arrlookup[arrfbox[c]];
) {0 j# a6 O0 A8 ]& r
no.text = arrfbox[c];
4 M9 }, G! p7 k
fbox[c] = no;
. N' ^: F# N8 O6 `
}
! }+ p$ R% G2 N/ D, x4 q1 w
for(c = 0; c < arrtbox.length; c++) {
+ A3 ^% u. e5 [: d4 h1 S `
var no = new option();
+ T# ]$ u+ g5 J6 N" i2 q
no.value = arrlookup[arrtbox[c]];
: ]% U0 o2 b @! k
no.text = arrtbox[c];
# D; A& V% b; y3 Z; L( m2 i; j
tbox[c] = no;
$ n/ s" d5 |1 x- p% t, Y0 ~
}
8 ]6 m! F( e' e2 \7 S5 o) b
}
1 ^! a ]! j2 P# W) `& m
</script>
3 ?# t# J) ~/ f! U3 I9 K$ x
</body>
, x/ D& H! t, p! a0 e+ t- J
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
