标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
* O+ h5 `' d: m2 u7 u
c pageencoding="gb2312"
+ M' j3 I: C6 A3 @$ I
%>
6 u4 V# S$ ], q: h8 k! ~1 E
<style>
. F. ]7 e! L; }, D% Q& m' B- E
.f9{ font-size:9pt; }
( y U, u: ?9 `0 V$ X
.bgc{ background-color:#aecaf9; color: #0033ff }
; t' c% ?4 r" o& L! f* E4 ~
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
) O9 {* T" n! d) M5 Z
border-bottom: solid 1px #4e7dc1;
: b, t. \) f0 T3 @' c: [
border-left: solid 1px #aecaf9;
3 m; N8 M* `9 u- W
border-right: solid 1px #5679bd;
$ ^3 T! @! Y; g+ m
padding:1px;
3 Z, e7 ?; Z5 N# r
margin:0px;}
, d& J$ u/ T6 B* \4 {1 Y" D; i
</style>
* f0 m- i+ I# L3 @# }: w
<script language="javascript">
. [' L: G3 g# H3 G- h
<!--
! f. @ v! ?: P: c' l
function rv()
! |- l7 f; J2 l# g2 r2 v, N
{
" P; ^4 v$ \0 Z) b* w
var val="";
- b* H2 q4 ~7 G$ N, y
for(i=0;i<combo_box.list2.length;i++){
- ?$ G* K# R. V- s3 S3 k
val+=","+combo_box.list2
.value;
' v5 G9 F! I7 s- K0 @7 i" g
}
, m' f) q! u% u0 N! \
if(val.charat(0)==","){
( U) T8 ~; H5 _5 d( D1 K% g5 Z. ?
val=val.substr(1,val.length);
- k, j& ~( n. J: ^
}
" Y+ W. }2 D( _8 @+ E
opener.form1.frecname.value=val;
1 J7 z& u" p: X0 M/ Q H7 |. u. u
self.close();
9 Z+ k' Z; y* m
}
8 `" h( J! H3 }9 h3 D
//-->
( X) J2 i1 E' J) N
</script>
! j; f& @3 h: x; M
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
2 }- T; v& H) B$ k5 z3 w
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
( X x( g; z3 ^
<%
/ U, \ j9 U/ U2 V7 p, ~, `' j9 i1 s
cdatasource ds=new cdatasource(); //数据联结bean实例
8 O( I5 w$ p* }2 g, }4 ~! ?, A
java.sql.connection conn=ds.getconnection();
4 Z/ V: k; x) B* F5 @
java.sql.statement stmt=null;
* M) M" V- K# G9 W
java.sql.resultset rs=null;
2 V; T4 H- |9 T$ K) c+ h
cdatacheck dc=new cdatacheck();
& g0 _1 S4 |3 W6 Y) c: h z
%>
1 k: ]2 v" D( F3 K! n" x) \+ n
<%
+ O1 K5 Q+ E8 B J! Q" C% V
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";
/ X) j) J3 @& V
stmt=conn.createstatement();
' c) S+ B4 @8 S7 ^( ?$ v
rs=stmt.executequery(sqlu);
* M- x' i1 B- r, k$ O
%>
) u' l2 t/ e$ `. z0 g' [; Y
<script language='javascript'>
* y# c6 M" S3 A1 m5 a8 `: `3 r1 T* ]
arr = new array();
: `" J3 P8 A8 {( Y5 V# s( k
<% int temp=0;
+ i9 W, S! t5 X$ @
while(rs.next())
: @" q& c! d! B
{
# `, @. {0 P6 g- a* f* i
%>
( e! ?: A2 c8 V% Y) v% L+ k
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
7 n- x" |) q! C, m
<%
0 g( t8 f8 S( r7 h5 ]
temp = temp + 1;
6 |) s, _" O% c: ^4 v) A7 f
}
; c( x- z$ f4 X# u
%>
4 q/ i) s! I) f# W# @5 f7 L* w) B
temp=<%=temp%>;
% k! A3 w! R5 v% V4 w- G0 ~
function changelocation(id){
' P6 z( m7 L! S9 t9 o2 K
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
% \5 K3 n+ K9 y. D8 a5 B
var i = 0;
) a5 z" F8 f! h% c4 ~/ F
document.combo_box.city.options[0]=new option('-------','');
6 R$ g# x" q; B. ^# a+ j* y% U' ~0 ~: k
for(i=0;i<temp;i++){
* y% s1 I! a+ s# }0 {" j
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
- g# g. @% P; _. y4 M, C9 a" l
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
$ K1 y1 Z) ?: W1 ]8 Y$ @
}
! p+ a' Y( H" C0 W) o4 [6 ^
}
j7 F6 v a7 z$ ~! i1 p3 r
}
+ U' z; F5 N. }4 i; e: M$ A1 ~ k
</script>
9 B6 o1 W9 w; w2 B/ u, ?" k6 x' S, W
6 z% W1 X7 n p: S* f( L' T& }
<form name="combo_box">
% ?9 E: N% j4 Z; m/ x8 z: E
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
; K9 y3 n* o. g( T. v2 ^# C
<tr height="24">
% K c' \: S9 j! f$ s: t
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
/ H$ b$ j5 `5 ~* y, F1 z4 @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% g1 I( O: o' C+ ?/ K% K
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
) c* |$ K( N5 e* w6 T3 o
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
! k, ]1 I1 L; Q& K2 Y! B& q8 G
</tr>
; u( K0 {. N, @ G. |
<tr>
! l: b+ C/ |6 Z: q, P4 r% r6 Q
<td>
( r* b( T' J0 P6 x% r; }& V9 U
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
/ N: Q/ v. p0 c6 ?" n% O3 z
<option value="0">请选择部门 ---></option>
0 N% U; |+ f! X* J' O2 G7 |
<%
# K3 I* c& c8 S8 B `' e4 o. d& d
string sqld="select * from tdept";
: t& p6 F+ h* ]8 Y( x9 u
stmt=conn.createstatement();
D/ {6 y- _8 O8 `, E4 _
rs=stmt.executequery(sqld);
' t( r6 ^4 P6 F* ^, ?! s
while(rs.next())
, N$ _2 z" G3 U% H
{
/ f, O) V3 ]& T2 g5 j( Q. D# h
%>
% y7 K! }" c: ]2 ?( g2 {
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
7 ~2 B* g: H9 Y1 I, l
<%
2 [5 z: ~$ h0 p- G. y- A
}
* R, v# v' w0 N* U9 ]
%>
7 I/ m% \* I8 T- }
</select>
8 K: O+ o: J2 D+ u8 v/ q
</td>
' z p* D: \8 ^, q3 Z/ Q0 k+ }
<td>
8 ]3 y6 c7 E" {. v
<select multiple id=city style="width:150;height:200" class="bgc">
( f, @# i% n. d' \4 D
</select>
3 e, \, C5 p& e% m1 U7 M, ~8 l8 u
</td>
4 Q# S* E7 V( p" ?
<td nowrap align="center" class="bgc">
`! [& W; i% k& @9 L
<input type="button" value="<<" class="buttons">
e4 y1 h' B3 x: t# g
<input type="button" value=">>" class="buttons">
* Q0 n6 M+ a9 a1 V1 T
</td>
: J+ F. }# u3 R3 b
<td>
7 E, V$ v7 e2 ~5 _! F
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
- j5 v! W7 t$ u' ]2 V" d1 n* L
</select>
0 Z. D3 l; D' _; b1 g
</td>
' S9 X! i, {* A6 L+ B
</tr>
2 s2 \" k) o0 n& c
<tr class="bgc">
+ ~' w# p( d/ v% G7 V
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
: z1 C% c3 s, G* f, ? i
</tr>
! S( F( D- B% g( q7 P; l% @ x. ~2 [
</table>
- e1 w0 [$ L) S0 ^) r& e
</form>
) S+ [+ p7 z g3 t
<script language="javascript">
3 R# @* y# x) D6 |2 B9 f
//人名移动
+ C0 _+ T" U U0 A2 Y, o, X
function move(fbox, tbox) {
, o3 W# U% l6 K+ {9 F2 q3 I
var arrfbox = new array();
' B! e1 l4 n+ G, {6 K* i
var arrtbox = new array();
$ ]& y) J- K- ^; c1 y, N# X
var arrlookup = new array();
3 ^" x7 d' t* j' l9 `' O
var i;
) d; Y' y8 k$ s* J- j8 }/ V
for (i = 0; i < tbox.options.length; i++) {
( g: E9 K: q1 w Q6 ?' q( {% H* r& _
arrlookup[tbox.options
.text] = tbox.options
.value;
/ ?3 @" ~( f9 \' Z b Y! {; S. S3 ~
arrtbox
= tbox.options
.text;
9 c# G' c3 U: k4 Z+ D
}
8 a/ ~, W5 p/ }; Q
var flength = 0;
3 m) J: V" ]' D# ^. T4 t3 q
var tlength = arrtbox.length;
! P5 p8 r4 ^/ N! B
for(i = 0; i < fbox.options.length; i++) {
0 g/ \) n. |2 B) X4 D- m) y$ K$ l) o
arrlookup[fbox.options
.text] = fbox.options
.value;
( W* m- O6 a: p& v- P
if (fbox.options
.selected && fbox.options
.value != "") {
8 o; h# b1 b* m6 h: y7 [- ]& u
arrtbox[tlength] = fbox.options
.text;
5 P4 q F# U5 V" G( m$ q, v3 Z2 v
tlength++;
6 L$ h& y1 Y; |. R3 k
}
$ }0 x) K4 W! J
else {
* n1 u5 k# I5 @/ W! \& t3 s8 F) ^
arrfbox[flength] = fbox.options
.text;
( u5 p! g0 O5 G8 S; O' d- O
flength++;
* o+ C# F E$ m* ]) _& Q' h3 x
}
" \4 z+ l. z# I& |: e% f
}
8 H* G% J+ D2 S* t
arrfbox.sort();
6 J+ r! K6 U3 M3 v& }
arrtbox.sort();
! q) N' C) F2 Z
, I8 y- J3 F* a% U. p( G
fbox.length = 0;
9 {# q8 G4 y( }# g2 s! G
tbox.length = 0;
9 ~; k+ g8 y% v9 m2 b- ?
var c;
) X3 D! [3 [( L$ L
for(c = 0; c < arrfbox.length; c++) {
3 H) Q7 \) f ^7 Q! ~+ x/ O
var no = new option();
# h0 s8 h( J" c8 E( r
no.value = arrlookup[arrfbox[c]];
# ]- J; ^' W! t) Z7 c( x6 C
no.text = arrfbox[c];
! n6 P+ N) {/ m; [5 i
fbox[c] = no;
$ b3 w3 x5 j$ v" g
}
, M0 ?& S; @' n4 Z
for(c = 0; c < arrtbox.length; c++) {
+ X! L$ [! J. d6 m m4 `" o
var no = new option();
0 S1 x( i' o: Y! \/ b* A% `
no.value = arrlookup[arrtbox[c]];
2 M) x% y' F5 t% P' O0 G" X
no.text = arrtbox[c];
( a& A* L$ Y5 [$ @% o* n J
tbox[c] = no;
& p7 [" n* r+ S1 j% j
}
/ u1 D9 a* i7 ?7 w- R
}
" H, i+ f& X! ]7 _3 _
</script>
: n& n8 i5 x' C* X! H
</body>
$ u5 K3 Z) m0 U" M4 p% K
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
