标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
4 P A1 o5 d5 S+ ~) ^+ j, ^
c pageencoding="gb2312"
) l% i" d$ L( W0 a* e5 Z& h$ u
%>
, Z9 A5 g# q& K; m: `: E7 H
<style>
0 |/ N2 z3 m/ B9 ]1 p0 b7 U$ y" m
.f9{ font-size:9pt; }
# i4 `1 o3 v3 H! |: n/ V
.bgc{ background-color:#aecaf9; color: #0033ff }
! I: C6 N- s1 [# l2 \; A
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
, D$ u& T$ A) ]: e* g
border-bottom: solid 1px #4e7dc1;
$ q! B6 q1 w, s- H v* \' n% e
border-left: solid 1px #aecaf9;
5 U; T& j( s0 v- V9 Q
border-right: solid 1px #5679bd;
( R* [7 Q9 W2 z% X! r
padding:1px;
^9 M d% g2 l$ R) }
margin:0px;}
4 x+ @* }( }8 Z/ M" C; m3 w
</style>
5 e$ _$ J ^3 f
<script language="javascript">
% x6 x* `& ?6 O% o. H
<!--
3 m$ |& U _& z7 R
function rv()
) Y& h' f4 t1 g* Y
{
6 P/ J4 n4 s5 {, I
var val="";
" j! T9 ~$ N- E1 g% ?+ E) I
for(i=0;i<combo_box.list2.length;i++){
! a. }2 [/ E, ~: D7 I! W2 J
val+=","+combo_box.list2
.value;
1 E, [* t( n$ S9 t/ Z3 A3 h1 g ?& {
}
t8 s2 t$ Q! E- j4 E; \/ u* i+ P
if(val.charat(0)==","){
$ v& ~; C8 V; l
val=val.substr(1,val.length);
b# l- K% x, z
}
7 R! K0 k: Q1 S6 {# g/ C
opener.form1.frecname.value=val;
$ ^, O1 A7 B* D' ?6 H) s
self.close();
2 i& g& f5 e( G" U$ E
}
O: O4 x. F Q( m2 l$ U
//-->
& S1 w# J: d( e7 P% p3 _4 [2 g+ H+ }+ Z @
</script>
2 ~/ `5 x$ I& N! l- u
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
9 H* v& M8 X; [) V2 l1 T( ?! b2 D2 i
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
o) N+ ]7 I8 {( w+ A
<%
4 q, O6 v( |: ~' w+ I/ F' M* }1 X
cdatasource ds=new cdatasource(); //数据联结bean实例
2 w) _" T: i% R) B. p- p. p4 }3 X
java.sql.connection conn=ds.getconnection();
. J. ?4 M. j, c& i6 T
java.sql.statement stmt=null;
' w" i+ ]+ n5 l) {4 q
java.sql.resultset rs=null;
6 n) ]: R8 I3 @8 G3 u& K m
cdatacheck dc=new cdatacheck();
/ X. q1 }3 l3 }: C
%>
+ [% s& V0 i D: ^5 i
<%
& ?% P& k3 q0 @) M
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";
+ w& @) H- G4 o" y8 r9 ? g% D+ B" a
stmt=conn.createstatement();
- V9 n3 L: E7 f% N
rs=stmt.executequery(sqlu);
" e# j+ A0 U. t$ j
%>
% {6 b. S& u' F7 s+ ~& W
<script language='javascript'>
$ ~- H; L9 Q/ c6 p% q1 b$ f9 L, U
arr = new array();
- V9 j1 A$ A! B: @1 T
<% int temp=0;
4 m& x( F% E7 P6 I
while(rs.next())
5 z+ Y& R) x* ]: a
{
8 n4 y2 T, v& H$ D3 i
%>
$ d/ X* e2 U! H1 N% l/ J
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
; K5 {2 n3 c( A5 v- ?9 R
<%
, W, v [3 A$ B
temp = temp + 1;
6 `% v) R& T4 F+ t7 Q# U
}
$ V: j' E# m7 i
%>
' ? s0 O6 Q- r8 z9 m& O+ m. i$ a
temp=<%=temp%>;
5 a7 \; b: B) R' `) I# ]4 b
function changelocation(id){
0 n- m4 y! }! O6 m
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
: S" x, m2 A+ C4 i- A+ f) U# ?$ ?
var i = 0;
' K: G2 q1 P6 i1 ~0 l. T; h
document.combo_box.city.options[0]=new option('-------','');
" ~7 O; S {, z9 s& \( o
for(i=0;i<temp;i++){
* Z1 F' G3 Z" C, M5 X
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
$ n& \8 B7 |6 A. ~2 C' G- r
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
0 M/ k; L; v! f
}
( h2 h7 j& _! ^
}
1 L' W9 q3 u5 ]) j! A9 @$ C
}
; k: j/ r1 ^8 B1 {
</script>
: v: I9 {- p9 h* \
( ?3 f# u5 ?/ w5 C
<form name="combo_box">
0 ]9 K$ o; U- a h9 L, a, V
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
* J7 t. V9 E, k( b: E3 ?* B, x
<tr height="24">
% `) o! E1 S3 E L
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
5 @7 D8 k% G1 S+ ^3 t- b
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
6 k5 @( ^( ^- i2 z4 Q
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
" E, Q) f6 ~+ f% t, m! t: ~
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
/ \8 [( ^, ~9 H. p
</tr>
6 b3 ? c# ? R6 P# x
<tr>
@* D# E+ W9 i: F" w$ _" }$ x: `
<td>
) P8 X, W, o, ~; p+ n+ l |
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
9 @: Y& i0 J5 R, G. X. {, w: l4 P
<option value="0">请选择部门 ---></option>
2 K3 S7 F! g6 w& m: u" i) B, g4 Q
<%
5 K7 U7 s H; D K
string sqld="select * from tdept";
9 a, _1 o8 f) N7 [3 U: B! C' ^1 I
stmt=conn.createstatement();
. @' E1 U! O1 _+ W% P# @& C
rs=stmt.executequery(sqld);
" v/ D0 P. `6 z4 t0 D* [
while(rs.next())
3 c4 {( y% } G% r
{
% s" l" y; Y( E/ W$ G
%>
& U7 H4 Z9 k7 c. M/ L! B3 g# y
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
- ~5 m, o4 J* V" J" R& m2 p
<%
. v$ R9 }( I5 E% I
}
! v% c G( h/ O+ g O
%>
1 v0 N) [" i, f" u# G4 L& V. A
</select>
: I: s( t1 y, j8 v8 y. C
</td>
- C3 O6 ^, x0 W0 w; S
<td>
! w6 L& [) D1 f5 `( b2 Y6 e
<select multiple id=city style="width:150;height:200" class="bgc">
% k3 l2 k2 g; D1 J& r6 M* h! ^
</select>
' e W, v$ b$ c- L8 n/ t: N$ h
</td>
. I+ J% }. _7 C5 n7 e5 j; b$ c
<td nowrap align="center" class="bgc">
) p9 S2 V; M# V7 d2 n3 X8 z, _
<input type="button" value="<<" class="buttons">
, M/ H3 x) @* P# C) \ t
<input type="button" value=">>" class="buttons">
* a z4 ~1 u; m" w( N4 d( r
</td>
9 Y. Y' b" o2 R w' ~. P& T {
<td>
) X* X3 Q% _& u- G# q: m5 u
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
( P$ x2 T5 Y I) S+ Z. [. t: r
</select>
: o# c: p7 ^+ v2 @" g9 T2 {9 A" J
</td>
) @; `" Z( _+ j) P& j7 a
</tr>
" G$ }8 w0 a) t$ I- A1 w8 s
<tr class="bgc">
8 ]6 `9 j- e; v
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
. ^/ C7 o" m6 C* o4 B
</tr>
7 S. j; i7 k+ \6 Q4 S; Q1 F/ ~
</table>
6 |$ X ^* |. ]
</form>
+ c2 ]# L' a- b) i) f# f6 F
<script language="javascript">
9 S# h: b- p' A/ e' l; V
//人名移动
2 v: H, S, N7 {( y3 P: ]
function move(fbox, tbox) {
4 O1 C/ v3 a3 W$ b I7 Q- G3 ]5 S; p1 S
var arrfbox = new array();
2 t* o" C3 G5 V' f/ W: _3 K
var arrtbox = new array();
# h& a) g3 |1 g! C0 `; g: h
var arrlookup = new array();
7 B# @* \, K+ e. M8 V
var i;
" ^- F$ \7 {' q2 K$ C1 F' O: p- X
for (i = 0; i < tbox.options.length; i++) {
6 x D' [2 Y. H7 o& X' P+ Z
arrlookup[tbox.options
.text] = tbox.options
.value;
- S, ] ], W2 u3 s& E0 i
arrtbox
= tbox.options
.text;
. s9 S, S+ B* Z, m( R: J( s L4 @2 k
}
9 |9 `" O/ U6 \/ c x. o- p3 f
var flength = 0;
9 ]2 L L4 q! j# H$ W9 v
var tlength = arrtbox.length;
2 j. F2 W1 V: f
for(i = 0; i < fbox.options.length; i++) {
; R* p4 E6 O0 \9 A
arrlookup[fbox.options
.text] = fbox.options
.value;
, Y" X3 K6 I# i% D- [% f
if (fbox.options
.selected && fbox.options
.value != "") {
, O: j8 ]5 B6 H! _( E5 J4 E0 t
arrtbox[tlength] = fbox.options
.text;
( q+ S4 g" j x+ g; a
tlength++;
( s% i4 ]- ~) a) P) F* F0 n
}
/ R4 N) P" L, e1 _: c. |
else {
. P1 B$ E" [1 [
arrfbox[flength] = fbox.options
.text;
- T6 A$ @& J* q! m% Q% y# c& z/ K
flength++;
- s( T" E n' l! Y
}
2 I7 J8 U' F# ^: y& R6 m& m) z
}
) i: ]. V" ^! J" w
arrfbox.sort();
% z; K/ R) q! Y" F' Q6 L
arrtbox.sort();
/ T* s0 Q3 a9 g( `
" h% M5 X+ i% u$ A9 }* y2 ]) L
fbox.length = 0;
3 t6 \( g1 j% B8 U
tbox.length = 0;
5 u, T# A3 ~$ G! f+ D: m
var c;
5 n8 M3 i. S) N0 G- A
for(c = 0; c < arrfbox.length; c++) {
% T: ^4 _& _2 ]$ m8 Q7 h2 g
var no = new option();
7 }% ?+ W. u* T+ S7 w
no.value = arrlookup[arrfbox[c]];
3 Y7 P, ?- j, q! _9 w
no.text = arrfbox[c];
; R& g0 o2 E+ X2 _$ N _# y
fbox[c] = no;
6 T T0 T* H4 ~! X
}
/ W: \. x) k/ L) Q; K# q" G" A7 ?
for(c = 0; c < arrtbox.length; c++) {
( g8 R N8 c" u$ T5 v) n& P' t
var no = new option();
0 ^& S( M+ b( A
no.value = arrlookup[arrtbox[c]];
1 W3 P6 u1 [* F1 G! A+ Y
no.text = arrtbox[c];
+ U2 V( e& @2 T5 ]) M
tbox[c] = no;
4 L; D7 C3 R: v8 H( l+ ~$ @- z
}
4 x& _& E) ]! M0 F) m) ]- i6 A
}
: \) ]+ v) Y/ E( l1 Y5 s, H8 }5 e
</script>
8 G9 i/ |% `& i7 L' c0 g
</body>
9 o. c( f6 \& F( c, W5 d/ V
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
