标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
. e0 J1 Q& M: A! @, k' h6 v q0 J( f' g
c pageencoding="gb2312"
3 K! d5 O9 E: t$ s6 \9 b* c
%>
( G ?& u$ U9 x3 \, D) n' M4 x
<style>
9 g3 O: u- c9 i% L k
.f9{ font-size:9pt; }
. {! M1 A1 V0 p% d" ?9 f2 j
.bgc{ background-color:#aecaf9; color: #0033ff }
& [) N, @2 o3 A" D/ r5 S! |
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
# S) Q6 K4 a, `% d
border-bottom: solid 1px #4e7dc1;
+ }0 [ G3 |# Q+ k+ w9 h4 \
border-left: solid 1px #aecaf9;
# c0 X! m1 f4 L0 x% q( B; H* \3 y
border-right: solid 1px #5679bd;
- W, A: [! d1 F, q, J
padding:1px;
! H8 R% I# q1 v" E
margin:0px;}
- Y; |- \5 S, P% ]4 ?( v
</style>
5 ^$ z" Z1 ~! @1 M+ M
<script language="javascript">
& d: b0 o- `( J0 l
<!--
: R, o/ m- k, }+ q
function rv()
# F8 h+ q: Y6 ?- l8 Y
{
" v3 t- t/ O; }4 {* F; f
var val="";
+ L; {9 @0 n% ?1 G; M
for(i=0;i<combo_box.list2.length;i++){
6 n# M n. c* y8 H0 d) e9 b
val+=","+combo_box.list2
.value;
) o$ C3 y- T( G, |4 y
}
' O1 b1 `9 J* y3 F
if(val.charat(0)==","){
3 }* `; l4 G1 }! M' S
val=val.substr(1,val.length);
Y* s& a8 n8 @- Y/ k. _1 ^ n
}
% N# |% K$ O7 Q. z$ O
opener.form1.frecname.value=val;
7 P9 i. t& \+ O/ _3 ~0 y
self.close();
, b$ k0 n+ I, E. }- X# u
}
8 d# h: b) P# }9 ]2 D
//-->
* [) Y4 x1 Y. s& z8 H$ I1 ~
</script>
' T j. R- m: l ~: p1 ]# k
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
) J' y4 e m5 t4 C1 h
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
& R# }" O% S& w* W9 Z1 |8 r
<%
( {/ G/ a) K9 N! h, `
cdatasource ds=new cdatasource(); //数据联结bean实例
9 r! P5 \5 {$ I2 B6 c" r
java.sql.connection conn=ds.getconnection();
) X, h. Z6 o n( k; i. L( U
java.sql.statement stmt=null;
. a9 L& ^& O+ h+ B2 I1 @
java.sql.resultset rs=null;
; p( c+ w: n* S3 R; d/ O) x/ m; k
cdatacheck dc=new cdatacheck();
% F& O" r+ s' s
%>
" h+ l4 D/ f2 Y ?5 [, d- Q8 s, N
<%
. p6 _1 G; C% s% K p% l- {( v( e
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";
8 f) m5 z; q5 @, G1 r
stmt=conn.createstatement();
8 x1 b) {5 D# @3 P) `/ h. N
rs=stmt.executequery(sqlu);
+ N% o2 G2 c7 O' G7 R
%>
4 H6 r, q5 t3 _) k# q$ w
<script language='javascript'>
- W4 K F. z2 j7 E6 C7 \3 j+ i
arr = new array();
& @4 x+ f" D+ j# [
<% int temp=0;
" t, G/ U1 o9 S; V- {; x
while(rs.next())
" r2 S0 S. I: c2 I- k. ~+ n
{
/ {# V* B5 @5 r
%>
: e v9 V2 e7 N" L, V# |) H7 O
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
( Y- T0 v5 A9 |2 T4 t9 F1 \% F
<%
; O' A+ d& ?1 ]
temp = temp + 1;
. N, [; }% x# h" X
}
7 ]; z* E# ?" Z+ B. S% X, N6 L% u! ]
%>
- X, q# t3 o' ~2 M
temp=<%=temp%>;
. q, z6 H$ y( J% O6 ^5 B9 f/ ]6 e
function changelocation(id){
+ {' i* K) S- t% q% U7 k3 ^$ U
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
/ q0 X# U6 k4 p2 D: o; y+ G" Q
var i = 0;
! n7 e5 z( c% j& h. R8 r, b
document.combo_box.city.options[0]=new option('-------','');
. }+ E7 o: g4 V/ A* g0 M$ ?; F) W
for(i=0;i<temp;i++){
/ B* }: l# N! |% r
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
; w1 g) U% Y$ i$ D* X1 R! k+ ~4 S
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
6 |6 [' g- ?) N! K
}
[9 h" m9 X$ F3 y3 x# k, n
}
( F. W: J! Z( ~/ \5 p' X2 o2 n
}
+ D/ ?" `# i0 N$ ]$ w0 M! o
</script>
) ~2 I1 k4 v0 w7 u6 m+ _8 u
9 X. h. u+ k4 z2 |% H, d6 o1 c
<form name="combo_box">
/ c+ W* O- Q9 A5 `6 ~8 E9 J
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
% J* r+ y# h- I' H
<tr height="24">
" l2 e# S% s3 d! v
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
1 d8 R% R$ [# l( K0 y6 ^
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
4 Q/ G' \! S3 w- d/ a
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
( x# B8 o( T8 R0 V6 n, p+ v s2 F
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
( k( n6 R2 a; d, |% b$ c8 ^
</tr>
& q$ D+ o. ^8 m8 \5 i, Y b
<tr>
0 K I9 i4 L' ~0 @# e
<td>
o- Z! Y$ i+ ]2 x/ O+ {; L' m
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
6 j7 U: N& j% Q+ A+ w
<option value="0">请选择部门 ---></option>
* `( |3 ?1 V# e- N3 i6 b
<%
5 e: } _( D; h
string sqld="select * from tdept";
4 V; K, n) i, Q# B
stmt=conn.createstatement();
2 Y) D& Z$ N4 E
rs=stmt.executequery(sqld);
# G6 k* b+ q- [" W: `8 {
while(rs.next())
% R1 @! M; p0 u) y, N9 M
{
- _, S7 T. B1 j: o
%>
, N* a- M7 \- L: j: L% g
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
: O5 {0 I; a. r5 F, L) `+ ]
<%
- M/ E! f# e, x' |. \
}
( ~, Y' F7 g& c' e9 z g; J
%>
, y) Z9 b. `3 D# K; Z* K/ Z
</select>
O7 M/ \9 |& B# ]- c" c
</td>
+ E& j- d& v. \: } T
<td>
( T6 o- e* T* L3 V+ n6 e/ v# [
<select multiple id=city style="width:150;height:200" class="bgc">
9 v7 F/ }7 {7 t
</select>
d3 v4 c8 v# P# A, M
</td>
+ Z( T; K/ m# J8 C& j# H
<td nowrap align="center" class="bgc">
/ T' z7 V6 X4 ?* q* F7 z
<input type="button" value="<<" class="buttons">
# c! c7 f6 B$ N6 c3 b4 G
<input type="button" value=">>" class="buttons">
' ~+ c* O2 u4 |( t0 D' K5 _( M
</td>
; L& u m: y5 E) A# T% u
<td>
2 r" D2 p: w. j
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
2 W# q" X9 H3 f9 V8 J
</select>
& i4 u2 l2 Z; A+ m1 U; n
</td>
/ a, s3 {2 Y6 v" | ?7 `- T, q8 g4 c" ]! e
</tr>
0 _3 I3 y2 q; }$ N7 R6 F
<tr class="bgc">
7 l' C& P. p/ z: ]. b0 F5 J" z. s
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
/ z1 ^" l% z, p, k% s- k7 C
</tr>
$ C3 Y: \3 X5 ^ ^0 t
</table>
9 {; c& w, p* p6 Q f- O# {
</form>
' q( M8 I( T. b/ Y
<script language="javascript">
6 q& k/ A" L/ ]6 V+ ^. W
//人名移动
* C# t$ l3 k4 _. J; _
function move(fbox, tbox) {
' X) y/ O2 l! C' v+ [- v) z; l- B
var arrfbox = new array();
4 u* y, S5 n! q, i% ?
var arrtbox = new array();
0 ? G6 O4 K* s9 |, _
var arrlookup = new array();
9 _5 n0 ^ i2 w! s+ g& o
var i;
& w8 u1 P* `$ _* u( ]4 E3 c
for (i = 0; i < tbox.options.length; i++) {
* v1 o( F; k9 N& C; ^7 O- ]
arrlookup[tbox.options
.text] = tbox.options
.value;
" i) g3 ?5 N" @) q0 L% G3 [' v
arrtbox
= tbox.options
.text;
9 L) v& {* L u( X6 w
}
& ?$ o: ?& S% x9 ?" Z# {. u
var flength = 0;
; T: w3 @2 `# b0 y- \ H* u& [
var tlength = arrtbox.length;
4 j' n9 N7 Y; u7 V3 r4 n
for(i = 0; i < fbox.options.length; i++) {
2 ^7 q! y9 A: E
arrlookup[fbox.options
.text] = fbox.options
.value;
" w# g. ]. E2 Q+ n7 _# I3 V
if (fbox.options
.selected && fbox.options
.value != "") {
~( `4 } ^0 \3 z+ `; j2 f
arrtbox[tlength] = fbox.options
.text;
3 q$ l9 o# F. y* i; M
tlength++;
{' ]8 {" t1 P$ ]
}
5 j5 L9 e- y9 n* `" ?6 L9 z. X3 g i Y
else {
; H2 r- O5 C7 x+ }4 G: l- }
arrfbox[flength] = fbox.options
.text;
# x% p7 \0 C7 C( M
flength++;
# P+ I( o" V+ x0 a# ?5 Y! k
}
: A* \! y, [. r
}
+ J- [+ B* W N$ Y
arrfbox.sort();
" H5 h& W, |2 _* T% t
arrtbox.sort();
+ Q% m% M7 @" @
7 a" V# o' | O# y/ y" z
fbox.length = 0;
( q9 Q; I4 q, I: i- n9 p4 [- _
tbox.length = 0;
6 S& |5 P; V# R! {, G( d9 F
var c;
; r* |7 V* f4 @9 D$ V) c" H; i) B0 g7 z
for(c = 0; c < arrfbox.length; c++) {
2 I4 R1 L, k C% F2 `% `" R3 b3 k
var no = new option();
: x. K1 \/ @1 S8 {+ z4 O }2 f) o
no.value = arrlookup[arrfbox[c]];
- d8 M' {. m9 `4 m9 H
no.text = arrfbox[c];
3 O4 e/ e% Z5 W0 t( U. H" P
fbox[c] = no;
* w. x; C5 Y/ t7 |" x. [. {
}
+ y7 ~+ T0 _6 w5 q% z3 C
for(c = 0; c < arrtbox.length; c++) {
& M+ }& e# e) _
var no = new option();
, D0 U2 Y- l0 C) g7 f
no.value = arrlookup[arrtbox[c]];
4 d# L. p* d1 r( C# O4 Z- q
no.text = arrtbox[c];
! B' i* n3 V+ B
tbox[c] = no;
- j, p7 J" C4 ^7 X. e" J
}
3 O! O; V+ |2 C: d" r7 \4 F
}
% }6 @5 C8 a; G& h7 j
</script>
: f. [+ j9 t! F3 P0 r* v2 [
</body>
9 F5 M9 |% D. D* R
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
