标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
7 Z* o8 i, m2 D$ K4 I6 \, C
c pageencoding="gb2312"
0 b' M* L& d I) e8 j
%>
9 H# _, u; p5 y: e
<style>
! R7 W1 P4 T0 v9 N
.f9{ font-size:9pt; }
! ]) |; v/ {8 u2 ?$ T6 J
.bgc{ background-color:#aecaf9; color: #0033ff }
, ]7 @( E& F$ z7 u7 C: B
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
5 l r+ ]1 ^0 [
border-bottom: solid 1px #4e7dc1;
$ P! v% T8 |1 B: r5 `- ~
border-left: solid 1px #aecaf9;
) I' ] E4 i' d
border-right: solid 1px #5679bd;
! c- r5 ?4 E3 J1 ?6 t6 ?
padding:1px;
% s$ v1 j* G; o) v2 S
margin:0px;}
9 Q6 N( ]# {* k+ d
</style>
7 `# e, b3 ?3 N2 V2 [3 p
<script language="javascript">
: C( K3 h% C( R# l
<!--
# t8 C1 K& T( E% J1 l5 b. w
function rv()
7 {; f$ c- l9 ?+ h6 k, v
{
, S& Y; `$ j2 X! s4 _6 Y8 k5 n- ?+ [, k
var val="";
7 n% M5 N& ], Y t# D! u
for(i=0;i<combo_box.list2.length;i++){
' d$ Q @5 d4 q% J, r
val+=","+combo_box.list2
.value;
% G" W) [! e3 k2 K1 c; c) Y
}
& }8 W6 \) r% v1 E
if(val.charat(0)==","){
9 A- O( n( [% k) _' n
val=val.substr(1,val.length);
, i) x$ x- u p% i+ g- Y5 C# m
}
' w {$ s1 \6 v8 t5 s) d
opener.form1.frecname.value=val;
) f; N1 L2 [: S) H7 U
self.close();
- J8 l3 m/ F* E. x6 S3 v' b* ~
}
# S7 f% O3 {/ ~5 {& v, s
//-->
$ z$ R) u8 D5 @; Y
</script>
- A$ W5 f3 b" W7 D: S' h
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
. s" O% W# O9 c* r6 A
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
~( @! J% C6 R: R
<%
* Q2 @$ i* B4 B6 H- [' {& U0 w
cdatasource ds=new cdatasource(); //数据联结bean实例
9 M" k( J( Z D8 h5 W; }& {: k9 Z
java.sql.connection conn=ds.getconnection();
- H) q! A2 g& P3 B1 g
java.sql.statement stmt=null;
( ], b6 {/ O6 `9 J; R- W2 S) O" {
java.sql.resultset rs=null;
# J4 y* G1 p$ {2 x
cdatacheck dc=new cdatacheck();
0 n- k- p( N- r5 I
%>
# ?# D5 }* e% K; K% s) u: I
<%
7 F- P2 B0 {" U5 N3 j' O' _
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";
* e! k* Y0 Z' ?& Q% ?3 H3 l+ e* c$ `
stmt=conn.createstatement();
3 V0 i+ J& C8 ]: @0 J0 }. N
rs=stmt.executequery(sqlu);
' ]$ v1 j' ~* k6 R4 R+ C
%>
0 q% d9 M, d* w# m. Z! `/ P
<script language='javascript'>
) E& u& D5 V" Z( M6 R% V+ [0 r
arr = new array();
6 c% o0 j: F' T# J
<% int temp=0;
. X2 `' j* A) Y6 h7 l s7 T
while(rs.next())
' A& M( o4 _5 V2 t/ M, ^% f* F
{
) D; c/ e5 Y$ K1 @. O( B
%>
6 R8 {' a, l$ P
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
( E9 k1 l( P, U* q
<%
) y" w. t5 C8 e _& H* O4 M u G8 J
temp = temp + 1;
$ \2 f3 P3 ]3 q! M7 k1 o) s
}
5 D! g3 `3 a: Z J) t* c. o- g. N
%>
7 x) @+ K+ i8 \* h0 G
temp=<%=temp%>;
$ x* R: u+ Q d
function changelocation(id){
8 N6 t+ p0 T1 B* p3 K: i
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
. k+ A' ?7 y! T9 q" }- @9 x
var i = 0;
% |: _" [5 K* R( J
document.combo_box.city.options[0]=new option('-------','');
* A0 ?1 d) x$ Z" \& e* P5 F) X; m
for(i=0;i<temp;i++){
0 I `! S* o6 B
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
7 \( r9 r- f; v( }" n3 {5 V
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
) P6 L$ g* c0 E/ h! P
}
$ t# b; V8 N# [1 |; X$ V
}
1 a e- M. C4 U$ ^2 t9 S. u
}
4 l x$ f' ~7 ]$ I6 k% l
</script>
7 J, Y* R9 g( O
1 [& j) Y, A/ b8 W# ?7 k
<form name="combo_box">
5 {1 i& A' W' X6 w. l, [- f+ |) p
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
' R" d3 E3 Y( O" w
<tr height="24">
8 g$ q5 z' ~, u# y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
9 F% x1 N2 i0 M& q
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
R5 G! X: t: b# x: N
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
5 x. r c) v% {. N) |1 f) m
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
% m- R5 `* b4 ]4 ^4 ? T8 L
</tr>
6 @. l8 E1 J$ c5 t. t
<tr>
/ M5 L V* _1 r& e
<td>
5 U$ ^. w' r/ t' i* F
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
- H; |( M# ]3 c, ~; Q
<option value="0">请选择部门 ---></option>
# l I. X0 [4 C; ]# X
<%
- j6 S5 Q* S4 j4 K
string sqld="select * from tdept";
+ R4 C( h6 f) }% M% x- \, f
stmt=conn.createstatement();
/ H+ ?* g) ^- j& C8 Y/ [, H8 F' y
rs=stmt.executequery(sqld);
8 @$ U4 C( }9 W+ d4 b/ o4 F
while(rs.next())
w* C$ l: ^( H- X# p2 Q# U" ~
{
" {+ A5 t$ h5 n' u& e( W) g- G
%>
+ C9 M4 h" t, p- H3 l
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
6 C u- U" b) p/ u, u
<%
( Z7 k: {* G6 D% n# S9 V
}
2 X5 R i0 w; S0 v% z6 k2 i# W
%>
' l! J j" j# F. k Z/ k3 {+ a
</select>
+ O. P- Z& v' {
</td>
1 i/ y1 W# G( P
<td>
2 k3 }3 s4 o* n. T4 L# h. Q
<select multiple id=city style="width:150;height:200" class="bgc">
8 J! ~* r4 [7 P9 l0 T- V. ]) L
</select>
7 O" `2 _& \1 P; o3 t7 V3 p
</td>
8 I' q' E i5 c* ^
<td nowrap align="center" class="bgc">
) v! ?! d, Q1 U
<input type="button" value="<<" class="buttons">
$ w9 L- H& @, \) G
<input type="button" value=">>" class="buttons">
7 G! }2 e {6 U! U. R) V0 b
</td>
# B; i. V4 i3 }; i
<td>
7 R6 y. a$ ?2 V+ {: z3 a
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
! }. B, ?( F1 \5 u, W* g; ?
</select>
* `9 r! k% V% @7 P0 w# p) u
</td>
5 L$ N* X* [6 J# H9 E% I
</tr>
, z [( _* f. J3 _6 |
<tr class="bgc">
2 J# p0 N8 n! X" X% m
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
( [- m9 a/ c* J% h7 h
</tr>
( F/ g4 m* g' I
</table>
9 Y# s: F7 E5 y0 t; U
</form>
, ?7 ~2 {* h- U: d' `! w
<script language="javascript">
- Q" b7 I( K" l! y, E. k( a
//人名移动
! U+ e- N/ Q& p b- u( ?
function move(fbox, tbox) {
9 j" E9 p! v; n# Z/ U
var arrfbox = new array();
8 E+ t/ M d, D8 J* R4 }0 Z
var arrtbox = new array();
/ \) X- D& |7 w
var arrlookup = new array();
2 |( c/ t' \7 `3 J9 T
var i;
& q, W/ `& B# x
for (i = 0; i < tbox.options.length; i++) {
$ p4 q( F& g. f6 @8 i& m9 P
arrlookup[tbox.options
.text] = tbox.options
.value;
6 _4 f7 \& ^/ l6 G! l- J* H' c- m
arrtbox
= tbox.options
.text;
! A% ?: ^% \5 u0 o: q
}
+ E+ t y4 w) w# ~
var flength = 0;
6 {& c: C/ ?& ^2 T
var tlength = arrtbox.length;
$ n! u$ ~; g2 R! ~5 c: P" v( I
for(i = 0; i < fbox.options.length; i++) {
' Y$ i' Z# m' q$ x1 D9 c* Q r
arrlookup[fbox.options
.text] = fbox.options
.value;
2 ^' h& n0 x% L- J: i
if (fbox.options
.selected && fbox.options
.value != "") {
( x' w, d' I/ s0 R# h# b' A
arrtbox[tlength] = fbox.options
.text;
7 l1 T1 @/ k( v, ]: G% } f9 z0 S# C
tlength++;
# l9 V1 B, q! p8 Q% O9 r; A# ]
}
5 k- I5 k# c/ G1 m$ ?9 F
else {
3 I" X* q1 a0 ?1 D8 z
arrfbox[flength] = fbox.options
.text;
9 A( H4 D g6 U1 \* }
flength++;
7 T! o; S$ O7 ?/ ]/ c# V
}
0 q0 Q4 I: b+ D& f
}
G6 m# p' j$ J+ H% }$ p% ^
arrfbox.sort();
3 Z# q$ J, h; D7 o1 ^$ n/ V& U u
arrtbox.sort();
% o% o: P* J) w' o
0 `9 U: |, J$ V6 T9 P) q7 {' \
fbox.length = 0;
# q4 I5 v% f$ s* }$ ]" D9 w7 [
tbox.length = 0;
5 L ^/ {$ I( U' B. @
var c;
: Z" m- a) H( }! r) f+ k8 y+ R# U
for(c = 0; c < arrfbox.length; c++) {
! d) w7 {# U% r: }
var no = new option();
3 s4 p+ J7 _3 f! b2 _7 O4 j* r1 `* p4 w
no.value = arrlookup[arrfbox[c]];
% z8 v3 x r; R# c6 c- e# i7 Y
no.text = arrfbox[c];
( {+ }" P, O( B1 v* z9 _+ e% Z
fbox[c] = no;
; G5 h5 b2 r% l; b* `% K
}
7 J$ l7 J0 M% W4 P: N
for(c = 0; c < arrtbox.length; c++) {
0 [, S$ u" x) L( \: B2 D
var no = new option();
+ x( f8 k! \6 v
no.value = arrlookup[arrtbox[c]];
3 g. B7 n' f F( _
no.text = arrtbox[c];
8 Z1 l5 a, B0 h! m( p5 I9 @% A
tbox[c] = no;
# l* L8 o6 k0 y$ R! P B
}
; ?$ d: w' \3 { r
}
" z) S! `& A! l& ?8 c
</script>
8 z8 B- Z5 ?; S" z/ R
</body>
4 Z l+ L$ ~5 U& e, `" {, y
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
