标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
2 p5 h1 U1 _3 g/ s* b) L
c pageencoding="gb2312"
/ t+ i. B7 d0 f
%>
- J k8 h4 M/ c5 q
<style>
: a2 p% _6 E8 k& @
.f9{ font-size:9pt; }
1 B" F$ s" Y# q7 y! m
.bgc{ background-color:#aecaf9; color: #0033ff }
5 J# U3 r. W1 n5 R$ U
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
$ B+ d+ N3 R3 M+ \! B& e9 |0 N9 b
border-bottom: solid 1px #4e7dc1;
* E A, N' s2 \
border-left: solid 1px #aecaf9;
5 ]3 Z9 H! B) E1 `
border-right: solid 1px #5679bd;
( l4 s! J1 G2 ^1 C
padding:1px;
4 Z4 Y* h/ l. N
margin:0px;}
1 y( Y' t& q$ d4 t: X% T
</style>
# g& A8 m& c/ _3 N8 W
<script language="javascript">
7 |9 g+ T- a3 a3 r- N
<!--
! g8 B. Q( w* c9 O- B4 S! a
function rv()
( B; z% T0 W& J; [0 [+ {, Z; o
{
) h4 n0 m1 i: S) N' F2 N" ~
var val="";
! y8 N6 S/ J. A8 f7 J
for(i=0;i<combo_box.list2.length;i++){
0 }& @; }) Q0 {7 z5 J/ t
val+=","+combo_box.list2
.value;
! B( V7 `% o9 M
}
9 \" ?# }5 a1 ~+ H, _, h) c5 x D" X
if(val.charat(0)==","){
8 v) h' x9 D# G% C! n
val=val.substr(1,val.length);
5 K0 w2 N/ I3 I- w' a$ N9 N; S
}
5 p9 G/ n3 d2 i$ D
opener.form1.frecname.value=val;
+ l% ^9 ^1 B, a6 c
self.close();
: |: I+ \1 z: `* o
}
1 E4 {1 x5 q. w3 E4 a& `& g3 r* A
//-->
5 C2 |- U% n+ E; ~% L4 i8 u- G
</script>
6 R; b# e+ l4 c# K0 ~6 p6 ]7 w: G
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
0 n- t1 p1 A1 T4 [+ w4 V& w5 y' o1 r8 V
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
6 @+ ~5 L. W v; T% J( v9 _
<%
& ?1 f: b" v( l1 i% \
cdatasource ds=new cdatasource(); //数据联结bean实例
6 \) U }0 U; F: U8 B0 g
java.sql.connection conn=ds.getconnection();
: `9 @: T9 Y2 X+ w
java.sql.statement stmt=null;
( z. Y: p0 J+ Z& O& r+ V/ B
java.sql.resultset rs=null;
8 Q" k) T' _: ~9 p" }
cdatacheck dc=new cdatacheck();
/ F% k' K1 W0 u8 m: O# ?
%>
, Q" h$ X( F0 F) J( W+ k7 l% J
<%
' o5 x; t0 F$ l I2 {5 l$ b6 f& L; 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";
! i2 K+ k: x0 u1 s' h& \( P n
stmt=conn.createstatement();
9 \; i9 e; h" d) c* k+ G
rs=stmt.executequery(sqlu);
7 b5 ^9 t0 ?" W8 N! r: A7 v/ k
%>
8 I3 g: D: b# _, e. M( e* J7 J% @
<script language='javascript'>
4 Z6 H& M1 w" L: v; a9 W' y/ P4 g
arr = new array();
. e; {1 q6 S# \+ S+ C
<% int temp=0;
& j: f* {1 u/ D. R, k; o$ ~
while(rs.next())
% r3 S/ h2 _( x
{
# _) Z7 P' x; U
%>
& l2 y' L6 E, ^
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
8 z7 V* h: A5 B. }3 S
<%
5 j5 y) n2 }5 W
temp = temp + 1;
1 X x" W4 D' D6 P5 ?. u8 L, G$ J
}
5 _3 n8 v% m4 t+ D+ s3 `) E' U
%>
* c& w3 B7 [' _- ^- I$ T4 R
temp=<%=temp%>;
7 }1 p- o. C1 l& ~& F4 r
function changelocation(id){
( `. N4 H3 k- S# t
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
5 H* H5 j& o2 `) D9 J
var i = 0;
' p# ^ H1 Z0 j- V" l
document.combo_box.city.options[0]=new option('-------','');
' ~+ W: I# n6 ^9 a
for(i=0;i<temp;i++){
+ k* L1 r5 Q& I& J0 e4 I, P, y- g
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
" p: n% p/ D! I2 Z5 g. }. M7 L
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
: n" T5 R( d$ u- ^" H' Y
}
' E8 w. O! c' L) F' T
}
' v$ C( B7 d: W0 c3 C" \ ~
}
$ T6 C( ?; q2 S. h% w: Q) g7 f
</script>
) A7 C. {' W$ S9 o7 z
) M: r2 Y/ N% O0 r2 a" t J
<form name="combo_box">
9 |( W8 l o n2 @0 W$ g
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
* @! T% w5 _& ]* j
<tr height="24">
" d7 B/ g( ^ G8 V
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
. c: E. m) `' o* C6 x4 q; g
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
! _2 t) W6 f, I/ q7 e5 @8 U5 }! a
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
5 x) c/ J; g9 L" k: T/ Q
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
3 R# @7 f# I$ r
</tr>
, F# e& K7 X. l! F( Q0 l8 O, w
<tr>
6 y' g# t- `2 n
<td>
5 Z& f3 }) U( x5 z
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
1 t# x9 \" m* t
<option value="0">请选择部门 ---></option>
: U( h, {$ J: a( ]
<%
w0 n" `! U3 ^: i5 c
string sqld="select * from tdept";
8 ~: x( M/ r! K7 a) J
stmt=conn.createstatement();
# k7 k' J+ ]4 k0 _
rs=stmt.executequery(sqld);
6 M7 P7 n- E. ]8 J e% L
while(rs.next())
+ Y4 d" z3 ^. o2 {: c: K
{
% q9 t% P8 Y& Y4 U% X8 d
%>
& }3 |/ ~/ G+ a; H4 ~
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
8 C1 t3 O0 n* d
<%
4 O0 T; o, [, k1 R! n
}
+ _0 y; f- a/ H, P* m6 V+ Q! k' y
%>
2 p6 m# g- S. U
</select>
) n' p% a( `7 ]1 M8 |5 W
</td>
+ i" X6 [3 i5 t8 E% _$ d' J
<td>
2 R ~8 b* ]9 a$ K; L0 Z. i
<select multiple id=city style="width:150;height:200" class="bgc">
! G @( I) v- Y s9 D
</select>
6 r( w8 r# G+ f' i4 B4 k
</td>
4 C- Q4 ]+ J6 r' ?: e4 d
<td nowrap align="center" class="bgc">
* N2 ^& o8 D( T: |4 d: |8 T$ M
<input type="button" value="<<" class="buttons">
9 U* X! D) w4 @" `: w9 E
<input type="button" value=">>" class="buttons">
% Y2 d7 j3 C2 v5 f2 q% N+ i% r
</td>
9 H# v R7 x# x. Y Q1 Q' a. u
<td>
/ _6 f {. }- ^$ U$ ?& H
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
0 r6 O3 i2 @: |5 b, s& L1 U
</select>
- ^$ F) Y$ T; `
</td>
J) I5 V6 i. a. I+ a4 u
</tr>
+ E# L# b7 }' z# B$ U9 x% {$ S0 n
<tr class="bgc">
& m# f" \* X5 l
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
* L( `0 @) j8 g/ k6 h
</tr>
0 P1 Y& g$ |9 \% t8 Z8 C* p
</table>
0 ]! _ ^/ Z$ l, d
</form>
. u9 f" ]2 t' n: L! J: J$ C
<script language="javascript">
# M# }- r$ r( m3 C
//人名移动
) O: S2 ]! t, g/ {
function move(fbox, tbox) {
2 Y1 C) d/ y2 w) |! l
var arrfbox = new array();
$ Y, ^8 e7 j$ ?7 @
var arrtbox = new array();
/ O: i( m' h) v1 V! d. P
var arrlookup = new array();
; u# [; N4 R& s
var i;
4 b8 e) g6 J/ t0 N
for (i = 0; i < tbox.options.length; i++) {
, p' V- V2 Y% u: E9 d$ ?
arrlookup[tbox.options
.text] = tbox.options
.value;
, r A, p/ |; ~: W& c! i
arrtbox
= tbox.options
.text;
- A* M8 b/ a; O4 Q
}
; q% C1 G$ F" N* a. G8 }
var flength = 0;
; T$ B6 r2 q- I7 _
var tlength = arrtbox.length;
3 A. ^$ l+ O' Z( i% |
for(i = 0; i < fbox.options.length; i++) {
+ C7 g. J! K7 w! U
arrlookup[fbox.options
.text] = fbox.options
.value;
, T2 y H- S$ y1 Q# s0 K% h
if (fbox.options
.selected && fbox.options
.value != "") {
- a$ S9 J$ ?5 v4 w# w
arrtbox[tlength] = fbox.options
.text;
K( F" a. P) Y3 x, B0 l
tlength++;
6 O+ z; v1 t% f; |- k! C6 \ r5 B
}
W, _: o! S O K& `
else {
7 L6 \! q9 ]+ Y2 V
arrfbox[flength] = fbox.options
.text;
- H& E) K' c; L& Q/ P7 U& D3 [/ J
flength++;
$ g( T) N+ Q: s+ a7 k8 t
}
* L% u/ ]# p3 Z* D8 X$ Z
}
# d1 ~- c& n, j* `& l" ]# C: x. |
arrfbox.sort();
' u- |9 ^1 X- o# s9 \- ^4 |
arrtbox.sort();
/ t" K; D4 f3 l$ u: Z0 n, t# J; M
2 |; R- N0 r: k
fbox.length = 0;
1 ?" F1 U. j! K% n$ B( J1 D1 l
tbox.length = 0;
9 B3 n/ q3 C$ C4 B
var c;
+ g" U7 k! @: `! a: z3 P8 O
for(c = 0; c < arrfbox.length; c++) {
( S2 D" y8 F6 V2 X! b! A* j6 Q
var no = new option();
% O4 F2 G; o8 C/ P, T( G
no.value = arrlookup[arrfbox[c]];
! v. }. J" K7 O2 @$ e: ?) W4 r2 o
no.text = arrfbox[c];
$ a5 D e& h3 P9 B
fbox[c] = no;
6 h- \ N% O) o
}
* l0 u: B. U7 @ v
for(c = 0; c < arrtbox.length; c++) {
" [/ f6 _ m( w I) a( o$ [
var no = new option();
, x$ p1 ^8 Q _5 ^" P
no.value = arrlookup[arrtbox[c]];
* P6 @4 W2 w: w _- q+ ]) e9 J: E
no.text = arrtbox[c];
2 Z( ~5 `, K( O2 d' s
tbox[c] = no;
# a' W5 P, `" V$ T+ `! W" M: g
}
; N8 s/ ]) X: p( Q7 ] C" s5 Y
}
1 T8 ~% J, L& r C3 r# h6 c
</script>
% W$ M$ \4 s7 {* z) F
</body>
: y; C8 B/ ]6 |. T2 q) L: Q
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
