标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
. |; I) w7 a/ H- H
c pageencoding="gb2312"
1 |4 G& C% ?% k3 e: ]& }" ^; H
%>
0 \. g' O5 I h9 b( X) c% _# ^! a
<style>
- \ P) u$ }; q8 ?( t: r) Y+ h. h1 \
.f9{ font-size:9pt; }
: b7 l! q6 ~0 q; G- ^6 e; L
.bgc{ background-color:#aecaf9; color: #0033ff }
! L1 t! V3 ^' O0 a3 d
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
6 k, |% P7 \% E* U5 k8 v% a
border-bottom: solid 1px #4e7dc1;
( I. n; E8 W( l# h B" G6 }; W
border-left: solid 1px #aecaf9;
# S, G4 X; _9 Z) M' N' X
border-right: solid 1px #5679bd;
& \. x7 D8 c/ }4 A
padding:1px;
1 X4 i! ~4 q. c! C f i) V
margin:0px;}
5 d9 \) ?; ]1 L" f1 ?# B
</style>
) p/ I* P, [+ f3 q$ e
<script language="javascript">
+ O) ?8 N9 X- ]1 W4 Y; i* T
<!--
5 Z# y! M9 K* v9 j2 q
function rv()
% N8 R" K; P0 r1 \8 P* ~/ I" }& c% s
{
/ V3 l/ L' F: ?! Y; K" _- i; o) n( n
var val="";
, z+ [5 E7 n+ X6 h7 d; D9 z9 f
for(i=0;i<combo_box.list2.length;i++){
6 p& {: M, R8 d# Y2 U& y, F: q
val+=","+combo_box.list2
.value;
% f+ D0 p7 M2 }" ~! ?* U
}
( e8 B$ Q* W- |% d
if(val.charat(0)==","){
6 A6 z& z" \& p! Q* I
val=val.substr(1,val.length);
( i9 L0 V) u: }+ v( u
}
7 i% l! s7 K& C4 z& f1 U1 N) s
opener.form1.frecname.value=val;
9 n. V) q) o* q
self.close();
- n8 u$ x. W5 G
}
2 @. S0 J/ f6 s- Y; l3 {
//-->
+ Y! M9 V# C" b
</script>
$ L% n- k% s4 \1 ^, ?
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
6 T8 J& D2 m# _8 t4 ]) M
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
2 w j: p1 a9 x: b. Y
<%
2 E+ C3 ^- m% @# S; g( H7 O
cdatasource ds=new cdatasource(); //数据联结bean实例
/ Y' {1 M2 ]; W1 {. r( c+ V% }9 f
java.sql.connection conn=ds.getconnection();
. Z- A% }' Y, I& N5 H% D
java.sql.statement stmt=null;
% ~0 Y' X y W/ p7 e* {
java.sql.resultset rs=null;
5 M2 E5 p% z; T/ r8 ?+ F
cdatacheck dc=new cdatacheck();
8 ~5 G' x1 B' o6 b7 y* c
%>
+ ?- H9 O D% N6 v9 u% D1 | A
<%
7 l$ p# ^* J Y
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";
- q0 M$ Y: C* a+ P
stmt=conn.createstatement();
( G* _4 S1 ~6 o% w# s
rs=stmt.executequery(sqlu);
' k# Y8 b* P* e5 g& W3 `
%>
) y0 y, `1 t% w& X3 E
<script language='javascript'>
5 n% R, {: j6 W& Z0 U8 o
arr = new array();
, G5 W) k& m) O, c3 f* v
<% int temp=0;
) T2 u4 j2 M% }- n
while(rs.next())
$ x+ [: r' n" J+ t. p
{
' S4 Y, E0 c) Y: e, Q# _
%>
0 r3 u6 v: h" l& `+ ~
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
# k- Q9 U* A/ Y3 ]. I. S3 A
<%
8 B" R0 n$ x+ [; w7 N$ `
temp = temp + 1;
`& h1 a3 I+ Z% p' e% Q
}
) |$ l6 F0 _ P! B2 G' S
%>
8 }$ X( V) j4 z/ V
temp=<%=temp%>;
) }1 d% Q0 r# _+ \' x
function changelocation(id){
2 o% [2 C6 U( A; S) f
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
1 s/ Y4 N3 j8 v
var i = 0;
9 Z; k; Q' _6 V( V' k% |7 }) _2 c$ w# D4 s
document.combo_box.city.options[0]=new option('-------','');
( \7 x6 C' A9 ?: q
for(i=0;i<temp;i++){
2 u+ U( c: M$ u# l: {* e
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
& E+ I+ H. V k: [! w, S( }
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
. t3 z7 i& V! k" t4 b+ v/ r8 s. y
}
& F7 r4 J! L2 `0 L$ W7 _, W
}
& X. i8 x# n( A6 o
}
' u( v% r# _2 ]) [
</script>
. e5 \- H, n0 i* A
, C8 A) D2 Z$ _8 X0 ~
<form name="combo_box">
+ o/ O, M0 A9 @4 Z# `0 K& D) d
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
0 Y( ^+ d# D# k! k$ X# M8 ?' J& `
<tr height="24">
' k% A3 X3 R/ s5 G/ R% g9 [# y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
, u( u4 e: w! f9 `2 b) n7 S1 e
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
3 Y2 H0 S9 d! H( B1 \9 q
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
0 ?0 w% C0 F4 A
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
" g0 n$ S4 B3 |
</tr>
* c/ v0 Z7 r; g$ j2 _4 l1 ]5 P
<tr>
3 ?( B; r6 r/ I: E- J
<td>
1 Z& s/ l: I8 D4 P& k
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
; [1 Q) Q* _5 A
<option value="0">请选择部门 ---></option>
# \4 l8 v( ^/ e! S7 s1 W R
<%
! e0 b6 D7 E& T2 h9 v" r
string sqld="select * from tdept";
5 }7 |. @# N Q: A
stmt=conn.createstatement();
0 e2 M( t6 |, @9 T
rs=stmt.executequery(sqld);
# x8 y& j6 p h0 }
while(rs.next())
. d5 d8 T& p+ s3 S
{
$ }4 w1 q* Z2 }' y) I
%>
3 n3 C' a8 p/ {% y
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
- {2 A3 @# p# X8 w2 Z& T: c
<%
- T1 V8 e% [8 ^: C- h8 T
}
3 I, T; L! \; ?; U3 B- S
%>
( c, ^' V+ A" R* ]8 L! c8 A' I; g
</select>
9 A0 p' A9 V: b1 Y. _! g
</td>
5 q6 m, d7 k, Y1 y
<td>
/ }% ?; B4 j7 ]& A" v2 N& u
<select multiple id=city style="width:150;height:200" class="bgc">
& T2 _3 G1 X. z6 n6 W& h d
</select>
+ P P3 N- y( f. L- e
</td>
H4 V4 Z' r( g9 i; x; s
<td nowrap align="center" class="bgc">
2 k+ M- |5 Z! X' D' t; O( M
<input type="button" value="<<" class="buttons">
# ?% n e8 Q) [2 S" q: b* T
<input type="button" value=">>" class="buttons">
/ [6 g, D6 N" [, K- V( n. t" F7 N
</td>
$ r+ T8 u: C2 H" U
<td>
; U4 D( O5 Y7 O+ K
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
4 b. B: ~5 m' K# v
</select>
/ q9 a0 E2 H# F. X4 x6 e o$ K1 r, O+ k! P
</td>
% d5 M* R- v6 |. {0 |9 p( l% B
</tr>
$ H$ r1 |5 Q$ d8 g, O+ h9 e: o
<tr class="bgc">
, V C" ]9 m: {
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
2 |6 U& p% H" U2 F
</tr>
" ~( C! T6 [6 L! n# E. N; p. f
</table>
2 @" K9 D& j) G2 |0 n
</form>
# W- e5 g( `0 t/ n3 e4 P
<script language="javascript">
7 m2 ~+ f, q' m8 P. C- L
//人名移动
5 B; `( \/ K, ?; H6 G0 F
function move(fbox, tbox) {
9 F3 E1 x. v- e- d8 H% z
var arrfbox = new array();
; }/ W- A) m/ g- Y# S9 S
var arrtbox = new array();
' B8 q: I5 Z8 b- e; {
var arrlookup = new array();
1 e5 @: o9 g' m: U1 j- x2 j# X4 F
var i;
. j5 K1 ?, O/ e/ h# @9 X1 Y! G4 M$ s$ ?
for (i = 0; i < tbox.options.length; i++) {
' K$ B( y9 C& j/ O1 J7 l+ i
arrlookup[tbox.options
.text] = tbox.options
.value;
" L* ~1 x* v2 I# d' M
arrtbox
= tbox.options
.text;
% ^! H3 \9 B; L7 }9 N* x
}
0 Z- E$ O0 q6 U+ }* a s8 [2 @
var flength = 0;
- Q; Q* L% W$ m; N0 f# F
var tlength = arrtbox.length;
% w& q8 n2 W% X# m3 t/ e( a# o
for(i = 0; i < fbox.options.length; i++) {
* ~! B( y3 e1 r* {- ^) J
arrlookup[fbox.options
.text] = fbox.options
.value;
1 Q) J: V- G0 T
if (fbox.options
.selected && fbox.options
.value != "") {
) N) S" f1 o7 o; K( D
arrtbox[tlength] = fbox.options
.text;
) S5 d, o. K3 U
tlength++;
7 u/ E. X! r; S' V( M
}
* b% C9 }6 k' J% w' @6 x/ H. v
else {
1 M6 L; L( y1 L x# A7 u2 T) ?$ L& j
arrfbox[flength] = fbox.options
.text;
5 G+ k7 \+ ~+ E
flength++;
+ m, n7 [+ P7 a7 E
}
9 p+ P; F1 ?- q8 M6 d9 l
}
A8 f# ], w9 `! ?* X
arrfbox.sort();
# ?% f% F9 m( _. N
arrtbox.sort();
: e: B* `# g1 a- d
% ?7 s7 O& A- g% K, c
fbox.length = 0;
4 A1 L& |3 O" r3 h9 D" P
tbox.length = 0;
' Z1 e; n& B2 v2 p1 y8 b
var c;
! V' r' S( U- A g# V% L" o1 j
for(c = 0; c < arrfbox.length; c++) {
9 ]8 i T; [! A0 C
var no = new option();
5 |9 r1 W. t; ], g s
no.value = arrlookup[arrfbox[c]];
0 }- z1 l8 E( T+ @
no.text = arrfbox[c];
, [! r* p& t$ S" Z2 j
fbox[c] = no;
1 C' h6 Y: I4 }9 f
}
# h$ J$ o# |- P8 O
for(c = 0; c < arrtbox.length; c++) {
1 _ p8 `; Z1 U0 o, U
var no = new option();
$ z5 H+ e8 ]/ y1 X0 w
no.value = arrlookup[arrtbox[c]];
1 W% ]9 a5 N0 r: Q
no.text = arrtbox[c];
% ]7 p5 \7 C5 d+ q+ d7 B* D2 J5 j
tbox[c] = no;
' r9 C" ~/ V! ]3 w* ?
}
9 m( Q2 Z6 Q: e5 I
}
& Y8 d$ N- D9 O& `( @: y6 R( t
</script>
1 p' u0 [9 g V5 F/ H
</body>
7 t) s5 r/ o$ R8 j
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
