标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
4 F7 B, |- V- m3 @' F
c pageencoding="gb2312"
1 o& }% [, }, g6 \. J
%>
" i: v5 H {4 f6 y3 z
<style>
0 x" p7 g6 P8 p+ ?
.f9{ font-size:9pt; }
; H! y8 V( C* o
.bgc{ background-color:#aecaf9; color: #0033ff }
4 n4 y0 w$ T3 C" y; _) u( h
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
! E9 a; n5 a: b; q
border-bottom: solid 1px #4e7dc1;
$ ~! L# {& ^" ?2 h. ^
border-left: solid 1px #aecaf9;
1 K5 E* I6 Z0 I" }* C* I: O5 s% x# U
border-right: solid 1px #5679bd;
6 H3 a0 z Z; X4 l) r( a
padding:1px;
7 k4 h+ U: t7 A% C2 r
margin:0px;}
' r1 L2 c: ^$ Y) d6 e( V
</style>
3 ], s! @4 N& |& y2 Y0 t8 ^' [$ p
<script language="javascript">
- U/ ?+ q( X& p3 a8 C9 `. T
<!--
5 F! p/ {/ H/ `
function rv()
$ ~, `' C7 L- f9 g5 q8 p& S
{
& C& ]' s1 S/ z; c4 O5 M4 O
var val="";
N4 n# a" ?$ f7 O
for(i=0;i<combo_box.list2.length;i++){
$ {2 n+ ^' \" ?1 k
val+=","+combo_box.list2
.value;
. m7 U+ a5 ?2 n. B% |) x: r
}
/ Z* \5 i; m/ N
if(val.charat(0)==","){
" M! Y2 z0 H7 H7 L6 C
val=val.substr(1,val.length);
$ E. O: C M4 I2 |
}
9 N7 F! u* {& ]; v6 e- m
opener.form1.frecname.value=val;
, F+ _9 H! F2 I! {- N
self.close();
9 t( @7 f1 J7 y# W
}
. Y! \: z; ~1 ?, e& J
//-->
% m p/ Q( |! Q9 j( F K& c
</script>
' r4 V) s9 \" N i4 i! I0 R" R% c
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
. }+ ]1 P9 R0 {2 _. h" u! Y
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
) T& r. @% a& J0 y3 I0 Y% A
<%
/ _( ?; f8 W3 J
cdatasource ds=new cdatasource(); //数据联结bean实例
8 @, c' P) g. f
java.sql.connection conn=ds.getconnection();
: ~1 b# U% q }, ^
java.sql.statement stmt=null;
5 H" Y" P6 A& [7 w( X8 n
java.sql.resultset rs=null;
% L1 l/ x- L. T
cdatacheck dc=new cdatacheck();
" e% K2 m4 C6 |) ~4 t
%>
% u! L. O6 N: r! u/ b
<%
5 E# X& c% C; v% R& [, m' \
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";
0 g* Y3 v# Z h
stmt=conn.createstatement();
, \# d9 k" ^4 S K& q& v4 f. ]
rs=stmt.executequery(sqlu);
7 U( [' h3 W4 I; [
%>
( }7 n* e. v6 H W" x* {; P
<script language='javascript'>
+ I. j+ r4 R# O4 X- X8 U# A
arr = new array();
8 |/ x5 ^" U1 B) [
<% int temp=0;
! N' u( s$ D* z! h6 y, l' ^. r6 J
while(rs.next())
. ~: T- L' B! b+ P$ v0 z
{
" z( J3 b& y- j/ d/ Y" i; T
%>
" g: U" v1 v# ^6 d% ~ k
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
' b1 U3 c/ ]' y( K2 N8 ]$ ~
<%
7 ^+ n3 w; C- T# a |
temp = temp + 1;
/ Y& ^* X( y# L$ r3 w
}
& L5 c% O' B' }4 z
%>
$ [0 m k! }' u$ _
temp=<%=temp%>;
: L- J$ |8 p6 a
function changelocation(id){
5 ]4 M! F% _; O6 ~7 B& t
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
+ b" O7 z; L6 w. e D% y- p
var i = 0;
7 E% Y6 y) m* c$ o1 E8 Q
document.combo_box.city.options[0]=new option('-------','');
0 Q! A& h' J+ a8 C1 `' d- p
for(i=0;i<temp;i++){
# ?7 x* e# G, q
if(arr
[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
# C+ I" U) j3 k1 {3 v
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
# O, T, O* u! u: p
}
. r% p7 R" c- `, C! O' c
}
+ k7 H% X1 U; K; o2 y
}
: a& P) g9 D' u, R
</script>
7 E) g. J0 K# Z. L$ z
& `) J1 A5 j/ b# z
<form name="combo_box">
! U) R3 K: B: f M! r/ _2 Y, w
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
. h# v5 a( |( K& G& G
<tr height="24">
& d- q& D% ^ f7 i- c# T
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
; }% y; U* m9 O. l8 Q' g7 H# q
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
' P7 Q4 b( w, h
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
; p9 ?6 [ Q$ K5 u- S
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
( a3 F/ }* b$ g( G9 K; l
</tr>
- j1 m% ? N' L0 G% l( U/ Z j
<tr>
( {( I- ~0 t3 A+ O G/ v
<td>
3 O$ D! u6 R) Z. c6 M% w
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
9 f! l* h% y: e/ V+ z( c# w
<option value="0">请选择部门 ---></option>
, u- P6 k! ?! I% t
<%
( T) }; W: V3 y6 `- ]
string sqld="select * from tdept";
& ^; ` L/ F5 Z" ]
stmt=conn.createstatement();
, m% V4 N3 ?8 r2 _, ~
rs=stmt.executequery(sqld);
! S+ r0 t" W* P0 N: Z' r& B
while(rs.next())
+ h* J* V/ v* j+ F" l
{
6 |6 M- b6 X. b7 ~! y6 n4 z) V$ g2 _
%>
. H% k8 V' N* n& G6 A# A
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
+ v: G# v; W7 r/ @ m
<%
5 H5 |* H$ f4 l6 ^5 l" H
}
) ]2 s0 A$ ?/ [: |
%>
; {1 p; L4 w0 Z1 E/ U& ]
</select>
$ |" J }( _- [% |" o# L. p. }
</td>
5 z! O4 m3 V$ Y% i4 C1 r& T
<td>
+ \8 `; l1 B- _
<select multiple id=city style="width:150;height:200" class="bgc">
6 J( w; Q6 |' A Q2 x
</select>
* j+ B3 N: h4 \) w
</td>
8 B& Q5 B( y; U( e7 z+ \/ q% }
<td nowrap align="center" class="bgc">
. x8 D* M& Z7 a* T& k& x
<input type="button" value="<<" class="buttons">
|7 v1 Z( K* S6 @: d o* S
<input type="button" value=">>" class="buttons">
q0 ?8 f8 Q3 K c( ^
</td>
# s# I1 m# a# s
<td>
$ x2 q4 Q7 v9 H: ^1 l! I& L
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
6 M( F4 J! w4 N, u3 z, F
</select>
/ H" s. e9 X3 q
</td>
3 t" j" [9 K' f2 t- P# W
</tr>
. k" f5 o$ ^. k
<tr class="bgc">
]& V* z. ?4 H
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
0 Q) Y/ b6 j1 D O/ W$ ^
</tr>
q: i" h4 ~* P7 w% {! v0 |$ g4 H
</table>
5 @) U! ]6 I3 \) A9 ~% D! ^
</form>
- w; D7 p( j+ b! @* l
<script language="javascript">
* j& D/ h& \3 B2 A% h4 n3 [
//人名移动
, d( }" T/ |7 N/ X+ T1 |, t9 p" x
function move(fbox, tbox) {
y* g9 A( \, F$ }
var arrfbox = new array();
: Y8 J' D: A8 H4 @# G
var arrtbox = new array();
5 q* S1 w' [' x0 w1 t1 u. s+ ~7 y
var arrlookup = new array();
) q9 b5 p7 Z, ` c6 }
var i;
?/ i1 N* q2 ^; Z: `
for (i = 0; i < tbox.options.length; i++) {
2 t. D% n) Q, N! s1 w9 l
arrlookup[tbox.options
.text] = tbox.options
.value;
" u) Q* \0 B" l) f
arrtbox
= tbox.options
.text;
, o2 @0 _" \ P- c
}
# X3 w, e2 V' Z
var flength = 0;
: A/ j4 V8 {3 G. |" k
var tlength = arrtbox.length;
( m+ P/ R7 i; p6 ^' H
for(i = 0; i < fbox.options.length; i++) {
" Y$ z1 t* {; |& `) F) Q9 \
arrlookup[fbox.options
.text] = fbox.options
.value;
- |5 V0 {& W# L. _
if (fbox.options
.selected && fbox.options
.value != "") {
5 x# N1 v; x" ]. L
arrtbox[tlength] = fbox.options
.text;
2 A$ R. r* a' k! `. j' N0 r! U8 v
tlength++;
+ ~ Z0 d, d# P( f# l
}
/ H3 }4 C4 D! l
else {
! c1 R+ u6 e( ^ J1 ^
arrfbox[flength] = fbox.options
.text;
9 {2 U" h$ G6 p5 A
flength++;
6 S3 A0 L% h# @! k5 @0 l
}
' ]+ M# k6 z( G* ^% F, T: b7 {# ^
}
( u9 Z; C2 Z; [$ I( k4 e
arrfbox.sort();
5 h! c7 [* ]5 l1 ?9 U! u
arrtbox.sort();
1 t. _' I$ N$ v
5 P7 e6 T B0 u" S7 V0 E. d: p3 f' g2 P
fbox.length = 0;
' H) r( [3 H4 [% C) |
tbox.length = 0;
1 L: @* v! N b* P; U- P
var c;
+ H |6 V: @ d, U. h
for(c = 0; c < arrfbox.length; c++) {
% k3 ] S, k# O# [) j
var no = new option();
6 u& i$ L; H2 B1 h
no.value = arrlookup[arrfbox[c]];
: a0 ~7 c: ^6 d4 _' _6 ~3 P0 |
no.text = arrfbox[c];
& J& j/ v( z* V" X
fbox[c] = no;
" a+ J' ?- r# e8 f+ P
}
* {+ f2 a' P, N( F
for(c = 0; c < arrtbox.length; c++) {
( n! U& ?/ C; r- r
var no = new option();
9 ~, r g# s! l3 F
no.value = arrlookup[arrtbox[c]];
8 g" a3 n5 H5 X) E
no.text = arrtbox[c];
9 R9 J0 D# d" D) ]# [% E+ w) Y
tbox[c] = no;
- s W& a* E$ q1 S0 z
}
, B k' ]/ w* ?* z8 P
}
( j- q3 W2 c# N Q i' y2 o
</script>
' T8 b( u. O `, x. L6 u1 z
</body>
" h. E8 ^, h; O |
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2