标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
4 i& ~0 a( M; @3 `8 O6 T1 H9 ~
c pageencoding="gb2312"
" s! E7 G0 H1 A) x1 G
%>
7 {9 E. H% L& e" [5 d
<style>
' M6 X- F# @6 |+ v9 a! h& h1 y
.f9{ font-size:9pt; }
, q$ \/ n4 N$ w2 L) F, e
.bgc{ background-color:#aecaf9; color: #0033ff }
- G4 N" `8 [- a1 I0 c
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
" |% A# B' ^# W3 P
border-bottom: solid 1px #4e7dc1;
* a/ q/ j8 w# ?. g5 q$ `' d' l
border-left: solid 1px #aecaf9;
$ c: ?. v0 b3 s8 _) I2 b
border-right: solid 1px #5679bd;
( N0 `1 S* E$ q5 m' Q
padding:1px;
R: `9 j' X2 J/ A2 ?4 Z4 u
margin:0px;}
6 i' A- G% U9 ?3 u3 b. M/ N1 M8 z
</style>
5 p% N+ x7 z" ], t' g0 d. I% @0 W
<script language="javascript">
) J4 W. N* H" {0 v8 O
<!--
# H* O1 {3 A- w; h3 W/ o
function rv()
5 L5 x8 ], M. o' D. R
{
; [5 r/ p) ~; B1 L
var val="";
& S6 z4 I- Q( S$ p
for(i=0;i<combo_box.list2.length;i++){
4 _, F: x9 F# V6 x5 C! g
val+=","+combo_box.list2
.value;
% Z7 s2 K" S, J I/ F+ F* }4 ]4 d9 D
}
7 t3 v3 k4 a* v, Q( W
if(val.charat(0)==","){
# j5 [( O: A" v* V1 D+ v- L# V4 w
val=val.substr(1,val.length);
- Y9 R' P1 |) o) K) [
}
& z6 B% ?0 ]2 l4 V S
opener.form1.frecname.value=val;
+ Z) |4 }* r/ ~- A! ~& J& F6 u
self.close();
* D2 k/ v' {+ i% y
}
1 L4 y" [* d3 ~
//-->
! M2 E Z9 A( O+ C' W
</script>
- p& @2 i4 }; }$ N3 o& J1 L
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
7 [, p$ M& \ a1 g1 g
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
$ Z9 w( E4 R |0 N' @6 x( ]
<%
, h/ g- K" k# g
cdatasource ds=new cdatasource(); //数据联结bean实例
' ^+ Z) M/ P+ K& O- ^4 k
java.sql.connection conn=ds.getconnection();
6 ]) B( v. A7 w
java.sql.statement stmt=null;
( b: j. W8 h9 m7 [7 \- c! d
java.sql.resultset rs=null;
[/ y9 c. \# q, ?/ G2 v
cdatacheck dc=new cdatacheck();
# }! B+ {2 P1 a8 G
%>
* ^2 @+ L4 l0 O/ U5 t! m
<%
8 P" e% V5 g2 ~! K' f2 F6 m$ Q
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";
+ g+ S, b( ]1 z
stmt=conn.createstatement();
3 |* G' u J* M4 _$ ~6 s
rs=stmt.executequery(sqlu);
1 V6 O! I2 P% S$ ~9 C
%>
1 ?2 \2 D/ r; u0 n. `
<script language='javascript'>
7 b) ~+ \& d0 j- ?, M
arr = new array();
( w: _0 Y8 q3 K' R1 N4 b5 w
<% int temp=0;
. [/ Y2 ~: H. [, i0 k1 i4 v
while(rs.next())
7 p( M% b/ I7 F) T% _# {) |- W
{
8 K8 F' V5 a. L8 B+ i' v
%>
% R I% J. l, C; D) |. o; Y* @
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
, V! X( G( L. I3 X2 N
<%
! \4 O7 y4 a" n1 m7 x, F
temp = temp + 1;
; s; v( W2 Z8 p9 m0 C/ S
}
T0 W% x5 \, x) b
%>
0 F& u9 }* w# n' O/ Z7 B
temp=<%=temp%>;
7 T$ V4 Y! q/ E$ p3 H1 @) ~
function changelocation(id){
0 Y& b" L& h }1 Q! R5 l8 b
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
) I* A, d) w) I' x: Z9 f; \9 @1 O! v
var i = 0;
1 O0 F- c- s+ O
document.combo_box.city.options[0]=new option('-------','');
8 v6 \6 N0 q. z1 a+ p7 S3 u1 ]
for(i=0;i<temp;i++){
% z7 [4 C3 n# D; j3 E) `4 {9 `
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
. Y. |+ F! G3 u1 [& w
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
: Y" _9 I% i) \. G3 C7 d+ ~
}
4 @$ H3 M0 s5 X; f
}
$ c" K/ B& h+ Q- H
}
[& `. |& b$ C. ~
</script>
J( G. _6 t6 ~! |4 }
% x; L3 S8 k5 K3 ?1 b8 ~ a
<form name="combo_box">
- D1 B# Q q# Q& Q. ~
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
# `. |8 Y: X" b1 r0 n
<tr height="24">
1 B5 C) q/ C$ t9 p
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
N! a( [: l) ^' P3 L8 t
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
' y: s7 I% {* v$ a
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
2 Y; }. o( b$ x( Q
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
) j8 w' Q. U2 p" M6 h2 ^' h( f
</tr>
% H$ Z7 a, |; |3 s; w: `' }9 I
<tr>
; g8 F& l/ I1 ?1 c' b
<td>
* ?+ a( c6 H9 g) v: r
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
4 M5 J* p' Q. x- ?* ^$ V1 {" K* F5 M
<option value="0">请选择部门 ---></option>
* R2 i# H# f) Y2 s( ~5 z. L
<%
) r7 Z' ~% P k; d, Y7 U
string sqld="select * from tdept";
9 w& m' Y+ ?% Y/ p% R+ e5 r2 H, K; C
stmt=conn.createstatement();
/ P" `, i8 B% r' ~0 x3 Y% l
rs=stmt.executequery(sqld);
$ ?0 k% q! V% o& I3 y. [% s8 w" r
while(rs.next())
- H2 z: ?' \- {6 g6 e* W# H! Q( G
{
3 W/ F. W, Q) J: ?- ?9 B) m1 g
%>
8 t& h) f% d' F
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
" V1 e3 ^" S T( U
<%
% `! X* [: b9 V! s+ d- l( x
}
: L7 | Q: o/ z) ~4 B5 g2 G
%>
1 N& c1 Z& R9 i$ O; n' i- u
</select>
5 D' ^3 s& x5 D# N% t
</td>
; x* L7 L' b/ M
<td>
. r& n" k' U4 ~ F* q
<select multiple id=city style="width:150;height:200" class="bgc">
: h. c" o7 U6 \- b
</select>
- T3 |% S6 S2 f7 I. M; _. j+ u
</td>
1 ^8 X' Z( b: h: i( P2 ~1 ]7 T3 W# M0 O
<td nowrap align="center" class="bgc">
y6 j8 {6 `- }+ o
<input type="button" value="<<" class="buttons">
7 X9 ?% N+ R# J
<input type="button" value=">>" class="buttons">
/ j9 i) L; o1 o# u
</td>
8 C, L1 S0 w9 X) G; M5 P
<td>
- _$ Q2 n( ^" M. K& h
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
# q6 P8 v( n+ ]+ K2 O
</select>
2 t' R# O2 q& Y
</td>
3 Q. o+ U9 j, ~$ \" `" ?
</tr>
8 k1 _/ P: W! g4 n
<tr class="bgc">
h' r% ]6 ?: y2 n, V2 T
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
7 A2 x+ H1 G8 b6 q* }
</tr>
! p3 e7 p v; e- F, s4 e
</table>
0 Y9 b. f- P$ D+ f! c' C, N5 h* r
</form>
7 k' Y7 d" b; V5 J) S2 t: h
<script language="javascript">
# Z4 }$ `+ `& ?+ R9 |5 p0 T
//人名移动
1 {! Y! m8 x6 N% \
function move(fbox, tbox) {
2 B, n- L. Q: b' p+ R5 h
var arrfbox = new array();
3 Y/ A. q+ H5 e, B
var arrtbox = new array();
3 d. H8 Z3 o# _# G
var arrlookup = new array();
# l8 O( Z3 C A3 L
var i;
1 O, w$ |$ e# ], l C" u
for (i = 0; i < tbox.options.length; i++) {
, `* y' @ j7 D8 K
arrlookup[tbox.options
.text] = tbox.options
.value;
1 z$ M/ `3 n0 |
arrtbox
= tbox.options
.text;
$ B4 l: i6 O* U. h0 m S }6 H; ?
}
6 q: @$ H& D1 e7 y
var flength = 0;
0 M: w+ i# y0 ?: z/ u6 y C) p) i
var tlength = arrtbox.length;
+ M* F! J7 }* G: u0 \/ [* W
for(i = 0; i < fbox.options.length; i++) {
. Y! {- ~. T2 U1 o
arrlookup[fbox.options
.text] = fbox.options
.value;
8 e$ u f& i% P
if (fbox.options
.selected && fbox.options
.value != "") {
# L+ s6 S: o6 K& Z* [7 _
arrtbox[tlength] = fbox.options
.text;
. H3 Q5 t5 g# S; J* n- H" z
tlength++;
% h- o% c* N9 ?( K' g% v7 s
}
3 B: \7 e! |% \* D
else {
, N x+ Z) Z, F2 L6 M6 t
arrfbox[flength] = fbox.options
.text;
- {! _8 ~. [' K, H
flength++;
+ \ N% A" N" R6 @4 R1 q5 m2 t: H( J
}
6 }% D" t: Y. A; V
}
, c. ?1 f' V+ D
arrfbox.sort();
1 _# Y! W3 m. Z2 E' a2 }
arrtbox.sort();
$ J, B! f$ ~1 @% U% v- K
. D4 Y) X( J* B( M7 O$ g2 g+ z
fbox.length = 0;
: n% P" I5 V+ T* O$ `" G0 k
tbox.length = 0;
- w8 u- a& L& I
var c;
' D, b. A% P/ z8 z
for(c = 0; c < arrfbox.length; c++) {
# u! K8 _( R* g) X* ?6 q* g
var no = new option();
- \1 D. X% L: g" S' L* L
no.value = arrlookup[arrfbox[c]];
, L5 z4 A! ?! X# D* j
no.text = arrfbox[c];
+ }$ o6 D3 |3 d9 f
fbox[c] = no;
) q$ N# N/ o" K9 T# _0 C" A
}
1 }, g$ U* \) V( J6 g- p
for(c = 0; c < arrtbox.length; c++) {
( q6 X) m( }+ k, W
var no = new option();
+ a+ ~2 r$ }% J. [& i
no.value = arrlookup[arrtbox[c]];
" x9 z0 o3 X3 ]. v! ?( W
no.text = arrtbox[c];
Z- Q8 k) E2 c5 d0 ]' V
tbox[c] = no;
* d3 Y3 p6 A" r/ A$ l7 H9 E1 [
}
4 o0 I0 T4 b, b
}
( P: g/ L- X) D- m* I8 E3 ~' m) h
</script>
# p) I$ ]/ m0 I$ z+ j+ L/ d* d
</body>
" ?0 Z9 |- m! |1 C; s, d+ Z) l
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
