标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
- U& x3 L' z9 W7 j" [2 ^
c pageencoding="gb2312"
: F% Q2 h% r: n5 M8 g0 q3 t5 i
%>
$ `2 x( T) }: b8 b7 D( o# w M
<style>
) h3 H& R2 s" T/ h+ Y
.f9{ font-size:9pt; }
" b* g% r: x+ X" G
.bgc{ background-color:#aecaf9; color: #0033ff }
8 Y9 A/ k' `' ^- x# f H8 _ |
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
* P4 U% N7 {/ t# k$ R* u- {
border-bottom: solid 1px #4e7dc1;
# _) i# s! z* S
border-left: solid 1px #aecaf9;
# x6 f8 c2 e/ O& l8 S
border-right: solid 1px #5679bd;
7 }( |0 K7 E) N L9 L
padding:1px;
6 W4 R7 h! R: x* H5 D( H
margin:0px;}
6 `, d7 Q8 r/ {
</style>
( I9 t5 G' H( L& v- W- n
<script language="javascript">
8 \# X7 R; Q3 \0 O! O! O
<!--
: k9 B2 Y' C$ R. h. j! C
function rv()
% Q4 g% p- \, z* V3 y Y
{
/ D8 s( }+ F1 u) P% l, |2 W
var val="";
; `4 b0 f4 N% p% `7 W* V. z
for(i=0;i<combo_box.list2.length;i++){
5 K6 Z2 Q; x+ k- f5 t% _
val+=","+combo_box.list2
.value;
+ h4 \$ \( z g/ F Y, M! v7 G
}
. ?' w! Y" h% T+ D% Z* R
if(val.charat(0)==","){
% ?4 B9 i5 ?/ [ z
val=val.substr(1,val.length);
' |6 I3 |% S- |8 q# v
}
9 J* n8 B6 l- s; K( ]
opener.form1.frecname.value=val;
; S }; `' G9 u* C2 X) W% K* L1 V
self.close();
3 `1 n+ N9 f5 b9 d4 V
}
$ c# h$ z& y/ a" P) G4 n) \/ x7 |9 T
//-->
, S: _+ N% j) Z, b7 {2 l
</script>
# q! [. a- [ F3 ~
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
! }% x2 P' D: L* P
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
3 [3 M& Q6 o/ C% b" }6 b* O
<%
0 F" \1 A8 Y$ I; ~4 k) L7 K
cdatasource ds=new cdatasource(); //数据联结bean实例
8 a. J& H9 {% T) F- i. k
java.sql.connection conn=ds.getconnection();
( {7 x W k) M
java.sql.statement stmt=null;
. e, N! f& s3 C# X S- ~2 k/ D
java.sql.resultset rs=null;
( N) S$ N, d& @
cdatacheck dc=new cdatacheck();
9 J# S5 ^, R* r# f4 t
%>
' ] s1 X$ m: Q/ N3 _
<%
+ ]/ i- _% d* T0 K' O
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";
' v( r, G8 Y d- V U
stmt=conn.createstatement();
- l/ [" Z9 o; d% \7 r
rs=stmt.executequery(sqlu);
8 x# r+ s+ `) S8 M5 L
%>
# {& u% t2 q3 q. U: h! `6 ~# X
<script language='javascript'>
" L4 A5 v, h# Y, \$ z! m
arr = new array();
. W$ b. B+ X/ j( l+ u, O+ a: G% I
<% int temp=0;
7 P/ v1 g' H, K3 B
while(rs.next())
0 @2 V% Y5 a# ^
{
! z+ \; j& _* j$ ~; K6 P9 U9 [
%>
0 A5 j# ]% ~/ H" U- M- A' R
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
6 s/ }( k' x5 }! ?( [: C
<%
1 ~3 _/ e* r! F! c
temp = temp + 1;
0 z! `+ g8 k' E+ C
}
4 e4 Q- I; S. b& v( ]
%>
4 }; P8 L2 R8 M8 x
temp=<%=temp%>;
- G( \' p/ |4 v) g/ w
function changelocation(id){
. u/ I+ f' O; u' b7 P# t
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
' L! }% [. ^+ A, P5 v6 K" d7 r2 p
var i = 0;
' v) W7 n3 H7 a2 x# f3 ]6 a
document.combo_box.city.options[0]=new option('-------','');
, ?4 ~7 s7 \$ M; ^3 ~( P1 H5 e
for(i=0;i<temp;i++){
& z. [" ` K" j$ f
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
% c3 W7 x! b. N; C& [* L/ k
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
0 t2 g A" p% A8 m
}
" n6 ~+ z, B- q* u6 |# N( Y
}
, b' @, C: g' H$ j# ?
}
; L% m) @3 d3 S6 D8 m: }8 }
</script>
- z, C$ {( P2 m% t; q
* F$ V8 D9 k1 t- F9 A5 \* O
<form name="combo_box">
' W. D1 q+ C* D
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
5 |* v" e0 l; j8 @* U# W8 e( y. _
<tr height="24">
; ~. M( b F% X
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
' x, S- J, Y5 Z& u# T! l0 H
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
A/ l- B0 e$ [1 `
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
- @" ]2 D" \- n8 ?- ^
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
! t d6 h8 e1 l6 d2 G z' o. Q
</tr>
9 `% F5 p7 R" X9 t% q( ^
<tr>
# D0 B# }7 \* C$ E3 |. t5 R$ f
<td>
. i- p+ E( @* h% }; Q& r
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
/ |6 j, z, H) J, T
<option value="0">请选择部门 ---></option>
9 Y4 o) @4 c+ M1 {2 E* \- C( S6 }. k
<%
. c* Y# T& o! @( h# ^2 p. e( j
string sqld="select * from tdept";
3 e+ S- R5 M) m, f( X0 O
stmt=conn.createstatement();
8 Y0 p! n% k/ @, I. G( f; |) S k# F
rs=stmt.executequery(sqld);
+ j/ F @3 X; O1 W5 }4 K
while(rs.next())
6 E, U+ i* c) m; T; A, e
{
8 M7 U2 \8 {- x6 A. X5 Q! x) U
%>
+ p, F; l, t+ k1 B; }1 R
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
3 U$ u: L# z; b/ J& U
<%
8 R4 ^ }2 j0 y# s; o3 X% o
}
: T- Y) p. _1 E3 B! E
%>
. p, j. c }$ t2 t
</select>
8 H% }* u. g, T, d0 ^2 Z3 g3 z
</td>
/ C4 ?5 g# D3 U2 g
<td>
* Q) C, m5 H& G1 Z) W. a
<select multiple id=city style="width:150;height:200" class="bgc">
+ c* @0 X$ F. T( k
</select>
9 R! y! ~! k4 P" f
</td>
" |$ l) u& O8 y' G
<td nowrap align="center" class="bgc">
: f- n% h, I1 e1 w t, v1 r
<input type="button" value="<<" class="buttons">
: S+ k. k* d. z T: W7 T
<input type="button" value=">>" class="buttons">
: l7 E% R( ^; m1 V$ I1 E0 q
</td>
; d9 o/ s& P: D
<td>
9 J t' V h' Z6 R6 R/ n1 m
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
: [: @5 z* }+ P% |" ^4 A: G" I
</select>
4 Z/ d5 X. l1 Y$ @! t- S& Y
</td>
m* W N/ a- p' H
</tr>
) \- a& G4 A2 s+ X
<tr class="bgc">
/ `, F- N6 H" J" y
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
! c5 q, C \$ w0 J9 y0 D
</tr>
" {, D& s3 x w. ?
</table>
, z" H8 O3 J9 n, A5 E {
</form>
* i! |; L$ ^& {: m6 x- x+ C1 ]" g
<script language="javascript">
5 c: B% B9 [& v& w* }. W. h! q
//人名移动
, e4 H9 F7 p0 t
function move(fbox, tbox) {
8 k6 j2 Z; C1 U: \7 P( K, N3 J
var arrfbox = new array();
" Y/ m: ^9 W" L4 k! A
var arrtbox = new array();
4 o; F9 Q( o* G- ?" ^9 d" ]
var arrlookup = new array();
2 _7 J. c9 @2 z& D8 p
var i;
$ v+ `# y6 {7 W0 @+ p
for (i = 0; i < tbox.options.length; i++) {
: K9 N! W- M. |% n5 F6 d) b
arrlookup[tbox.options
.text] = tbox.options
.value;
+ e5 H: D% X% A
arrtbox
= tbox.options
.text;
+ @% H- q) F' r9 d
}
@: C' j1 n2 A9 t1 b S
var flength = 0;
0 C. P c5 O9 P4 K6 V& F, l* p, h
var tlength = arrtbox.length;
) [" I. v' o/ H7 s2 P; J8 }
for(i = 0; i < fbox.options.length; i++) {
; b) o) Z% ?, s/ u& `7 u# E
arrlookup[fbox.options
.text] = fbox.options
.value;
+ e$ _$ I1 S6 w p; V w9 U1 t
if (fbox.options
.selected && fbox.options
.value != "") {
: U8 A. I+ e9 a( e
arrtbox[tlength] = fbox.options
.text;
! g8 F) {' `% I
tlength++;
; p" @- L0 `% R* Z( x5 z: o7 J
}
( t1 D5 U7 S! ]4 k% a
else {
% C! l& z D! H) @/ o, @
arrfbox[flength] = fbox.options
.text;
% \! S. s$ \) E8 ^7 n8 C4 R
flength++;
" S1 t0 ~9 P1 H/ b! n) T+ q
}
# M9 _; F- Q1 Z- }' P `
}
! ]2 Y% I7 N4 U
arrfbox.sort();
2 H7 w& J. E2 w
arrtbox.sort();
$ W! f5 A* C1 V/ ^$ @9 l
( B; z& K9 g# \( ?6 i- M
fbox.length = 0;
# l- N& @. g o" J5 l: e# e/ B
tbox.length = 0;
) E% J: W- `' m8 R0 m
var c;
: S4 f* e4 ~- ^
for(c = 0; c < arrfbox.length; c++) {
7 v# b( B+ m7 R6 s
var no = new option();
3 n7 k6 W% L! D1 g) L9 V) g% S8 O0 y
no.value = arrlookup[arrfbox[c]];
" g+ c( }: b. U, O0 q3 d
no.text = arrfbox[c];
4 O' {3 w# r* S) x1 J# P
fbox[c] = no;
4 z9 K9 |/ S/ I7 ?7 ~9 t( S- ^
}
1 J$ d* T8 i/ t: O ?* I, j! K! o
for(c = 0; c < arrtbox.length; c++) {
, T9 S' ?0 \9 l' g4 D0 H
var no = new option();
( A! w8 M$ ~" D/ n o* Q
no.value = arrlookup[arrtbox[c]];
5 u) v U9 w+ ~" `5 V; ~' `9 a
no.text = arrtbox[c];
* [; w( @8 N" m: A; C7 g9 d$ j9 J
tbox[c] = no;
/ k* |* v( g: B8 a5 E4 i5 |
}
* R5 W( Y P c8 g" }1 A' X& \2 ?
}
F+ I2 m* F& @2 V
</script>
) c% }' N6 r8 l! P, d m4 D
</body>
& V, y* u# j6 I
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
