标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
! \' a% q* f$ g* i9 t; n
c pageencoding="gb2312"
* L1 l: J* Q; O8 x
%>
$ d) C) Q2 ^: R6 d1 q l7 a
<style>
# D H+ l7 ^) K' I1 U1 q* L
.f9{ font-size:9pt; }
3 w/ q# Q/ o! }& ]9 q! ?
.bgc{ background-color:#aecaf9; color: #0033ff }
T2 L$ R6 T: j! ]
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
( s& ~, ^$ v# y$ u
border-bottom: solid 1px #4e7dc1;
8 o+ F* f2 s& m) \: d9 a" A
border-left: solid 1px #aecaf9;
+ H& W/ O: h( Y& l0 u
border-right: solid 1px #5679bd;
' B" |( S" _- C0 k( n$ n
padding:1px;
/ u7 P% P0 j' O* j0 Z
margin:0px;}
( y. ^* x5 D* e( P' ~) N7 }' m
</style>
( o& x& k% M) X0 n' A
<script language="javascript">
, Q. [9 @' U6 b) V& W8 H
<!--
7 i8 C3 Z" n3 Q, ~
function rv()
8 B |# c; a. c# i) U
{
% g2 K# T, o. {& k7 Z6 J
var val="";
$ Z( g' p6 o" |$ W2 q
for(i=0;i<combo_box.list2.length;i++){
+ ~5 D5 M1 A5 h0 F: g, N" _1 F
val+=","+combo_box.list2
.value;
2 y" {/ p$ D/ j2 c: Q! r) @
}
% Q+ I- N) M& `
if(val.charat(0)==","){
6 w* o2 E2 l. j, y# c ~
val=val.substr(1,val.length);
, Q! I% c9 q" }/ Y; v j7 |
}
; S! ~" }/ C/ l& B$ E2 Q+ z/ q) U
opener.form1.frecname.value=val;
; I9 f r$ ~+ A
self.close();
; U1 d, X$ T7 z* }, v. |5 L F
}
6 y3 I: y6 T# @+ o$ z) o0 v
//-->
' B5 a6 f- g! v. y0 f5 o
</script>
! a: J- r! s4 B9 V1 i: g" n
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
1 m( z& B5 F. Z1 x; x' o
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
. s5 e+ @$ R) v& L. e# J: V; I
<%
- Y) E2 d w' m4 W( M' c
cdatasource ds=new cdatasource(); //数据联结bean实例
- A! s* C8 O) p+ w$ w' B0 W
java.sql.connection conn=ds.getconnection();
2 n/ E" Q4 w( M2 h
java.sql.statement stmt=null;
# X& \' v5 n6 n8 T
java.sql.resultset rs=null;
; ]+ n/ M+ K2 c+ _. P: h. c! Z$ |
cdatacheck dc=new cdatacheck();
6 }0 l6 {' U% C$ G
%>
0 ?. e' l) s! u! F/ H
<%
( J2 w6 B+ e3 x1 f
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";
2 d7 \2 N0 _; Q; j1 p8 d- L" L
stmt=conn.createstatement();
. |+ H; y8 f& v' F6 Y, a% H4 v
rs=stmt.executequery(sqlu);
" v; W* x! r; \5 I
%>
`' V. ~( L. Y0 t& Z6 p" g
<script language='javascript'>
7 y( p: s! G7 |/ Q J' r9 M) z
arr = new array();
; `7 D/ L* z! [% I" }
<% int temp=0;
) E$ n$ L( F$ q$ p D* ^' J9 u
while(rs.next())
- l" g$ |0 z: S/ X. I9 ]
{
9 T( {& Y# Q/ v. k# J. \
%>
' w* T2 M# Q2 \* Q# v5 B
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
3 S l, M- L+ L4 ? \7 Y7 R/ r
<%
% q a/ _8 p( N6 ], J0 \$ I8 x, A+ s8 Y7 R
temp = temp + 1;
$ ]- |9 d7 h R+ \ M9 k
}
2 @3 H0 a6 l9 `3 V0 n# k7 t
%>
9 b7 ~5 n. P& V6 [/ k" ^
temp=<%=temp%>;
, k- Q; c8 ~& V* i7 C
function changelocation(id){
% w, Z4 k( u1 ]* ?. ^+ [* T
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
: C1 t8 v5 _3 E# N. C
var i = 0;
( i9 Z6 U) S) o7 d% d1 H$ e+ L) f5 k4 ~
document.combo_box.city.options[0]=new option('-------','');
7 B. o9 A) z# n6 o4 b$ I& }
for(i=0;i<temp;i++){
# ~% g* E4 h* l$ r( B, T6 t
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
$ \2 y5 G7 [" ^& j
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
2 B. t: r; V4 u; S
}
$ v) e( y; M6 |9 g5 F8 u
}
' x1 L, X& I9 B! J; m5 x W
}
5 `5 p/ }* }- @$ q, q* I1 Q
</script>
( M% f8 U, \8 F: S/ L* a. R
# W# d. h2 ^! C |/ ^" p3 }
<form name="combo_box">
- k4 [: B4 c0 K/ r+ ?/ v4 |$ ?# S
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
2 D. h3 m5 e0 }' H4 w
<tr height="24">
4 D6 C# \6 C% X$ C: a
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
7 J- F' t2 U5 S; h- G( }$ c1 S9 N
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ J' c6 I5 B7 q/ G1 d; N4 H7 ?
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
5 _; H/ [6 v8 `& Z8 Z2 J
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
+ B) z7 X2 U0 k& r. t$ `- p9 R0 T
</tr>
/ V9 l: g" w5 ]
<tr>
" G) ]. H( J5 h8 f5 m7 z1 O( }6 F
<td>
) D+ ~3 n) |9 l$ k$ z( v" a+ j
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
/ h+ o+ c2 C# W6 z) |3 C. X
<option value="0">请选择部门 ---></option>
' y# J! ~& u1 m: {2 j
<%
2 j6 h7 N8 U A
string sqld="select * from tdept";
o) _ F" [$ v4 }! [8 m# K
stmt=conn.createstatement();
5 x" @- t# d" n: k& s* S
rs=stmt.executequery(sqld);
& T6 Z; z+ V* b, _8 u1 A2 y; ]
while(rs.next())
5 j& y5 X8 u! @/ S9 {4 B8 i
{
7 {' O$ b6 b& [0 Y6 f
%>
( o/ P7 Z5 `- |7 q& E5 H5 E
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
# G) @( X" Q2 K/ e# y. ^5 M
<%
3 p5 L# e9 O" \: R) |
}
5 T2 E3 A1 c5 u+ B" O* d
%>
6 r! q7 S! o6 r2 H0 S
</select>
8 L& b$ p! ^: Z% c6 y5 p. S
</td>
3 x) b* H1 d4 s7 W }% ^
<td>
) e9 Z0 } I) ?' j
<select multiple id=city style="width:150;height:200" class="bgc">
# n( P) H0 {6 N8 _6 n; T; m _
</select>
% c, m& W: K) N9 S1 H* W' N
</td>
9 I% w! T$ S; O5 C
<td nowrap align="center" class="bgc">
- m) J; A4 R4 ] Q' e! V
<input type="button" value="<<" class="buttons">
" ?& E3 e0 l. @" n* `8 h
<input type="button" value=">>" class="buttons">
$ r4 K m! E' N! ~; n, w2 s
</td>
; \2 _8 Q |+ w6 S
<td>
/ v& F! X' ]$ \6 |4 ?! S
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
1 J' p! k6 _( ^* N5 c+ L1 O) i5 Y
</select>
/ A. w5 c' l1 V" {! p
</td>
2 Q% N1 O- a3 i- C9 i8 u
</tr>
2 B( A' d w8 e: w9 A
<tr class="bgc">
( ^$ ~' C' t- _3 Q) Z ?
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
" D) Q4 Q' \4 x/ U$ V( W
</tr>
w& R+ E) v5 m- n3 a& Y3 X
</table>
e, M/ V$ x- v' u7 c
</form>
. y2 s! c" y% e; U4 {6 V
<script language="javascript">
, [8 y8 b) ?* E2 b# |& H9 M
//人名移动
7 a9 N! N4 v, `$ j. H" \/ N( X
function move(fbox, tbox) {
3 `# B: ?9 @5 ?/ U$ N
var arrfbox = new array();
8 C2 J, \/ n) g3 W% t
var arrtbox = new array();
; n* f) q' k, M# V
var arrlookup = new array();
/ z# w5 D+ F' B0 E
var i;
& ~" t( d8 B0 S& z
for (i = 0; i < tbox.options.length; i++) {
) e+ ^# K; O0 X5 H+ x8 O
arrlookup[tbox.options
.text] = tbox.options
.value;
# N$ N% O' [0 N6 |- M6 m( w, l
arrtbox
= tbox.options
.text;
, p" @0 J& e1 K; [
}
1 [0 P1 O+ |$ V2 [' g
var flength = 0;
& t+ C. ^. V/ J8 b7 a+ h# f! w
var tlength = arrtbox.length;
& Y% e4 L: G+ I- R# n' Z
for(i = 0; i < fbox.options.length; i++) {
0 v+ F$ I! M2 h* @
arrlookup[fbox.options
.text] = fbox.options
.value;
S8 A; K" B s c0 b1 ~8 ?4 l8 V
if (fbox.options
.selected && fbox.options
.value != "") {
# r( j% {/ q8 s% ~: k
arrtbox[tlength] = fbox.options
.text;
7 f& G+ ?8 d; d, a6 ^
tlength++;
2 W7 \6 r7 [; L2 |" [& d" `" t6 g; Y
}
9 c1 N2 e7 i, t/ L% }
else {
$ R, R6 Y! z; p; x% A9 p
arrfbox[flength] = fbox.options
.text;
- d2 c4 j7 ?0 r' D
flength++;
9 W9 g; S& B$ M
}
; K" c, i. b+ w
}
; e9 I! Q; c( y4 g9 p: z# J
arrfbox.sort();
* {/ A: ~% P* j! r( I$ j. s& U) L" M$ A
arrtbox.sort();
- U* n4 H# Y$ Z( j# [/ E7 x
/ p [5 h$ _; L; b* J
fbox.length = 0;
" R! l* t6 z1 m) F& |: e; B
tbox.length = 0;
4 y) o" b5 H4 f% F4 [( {
var c;
8 w8 M1 \$ x- y5 {9 l
for(c = 0; c < arrfbox.length; c++) {
4 C) T( `0 _9 @( A
var no = new option();
6 q. d* ^6 S' \; G) p, W5 n
no.value = arrlookup[arrfbox[c]];
1 T$ m+ Y$ t) f6 t$ l* x
no.text = arrfbox[c];
+ y. C7 E; ?( u4 C- x7 u
fbox[c] = no;
$ B( O$ g p: C! h
}
0 K5 F# M" S. X" m9 i% _1 N
for(c = 0; c < arrtbox.length; c++) {
; e, \# G( Z' s
var no = new option();
" {* G% E" k) P7 T* a6 v+ l a' ?
no.value = arrlookup[arrtbox[c]];
3 c" F/ \" q8 f) v: B8 `
no.text = arrtbox[c];
. N. j4 k7 P$ [
tbox[c] = no;
* h# `% j9 q n+ |5 N" C
}
% |. l2 \! x0 {# I! C2 h& x: u
}
& y2 }8 }" ^+ s) `5 b; A
</script>
: L; D/ n9 N5 h$ I. R5 @/ a
</body>
0 z6 G+ M( X+ G% E
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
