标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
: q2 Y T9 A X
c pageencoding="gb2312"
6 K$ y8 D# r) Y; [# J- W
%>
5 F" S# X' w* y9 q3 Z0 }
<style>
1 s) b6 j1 Z* i1 `0 \. Y
.f9{ font-size:9pt; }
/ G6 [ n" y u5 \
.bgc{ background-color:#aecaf9; color: #0033ff }
& @+ ]& ^( X3 T7 |) c% {4 _
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
, v7 ~' }1 ?, J
border-bottom: solid 1px #4e7dc1;
8 t; P' _2 p7 X. X( i
border-left: solid 1px #aecaf9;
2 s: m. {5 t5 a! k! A
border-right: solid 1px #5679bd;
8 V/ A* Y/ x3 }( J2 ^
padding:1px;
% D* {* |' W* }; ]5 R: B
margin:0px;}
9 }" Y# w5 i! z0 ^1 x! T
</style>
- l6 X/ p9 d* P) |
<script language="javascript">
) N4 v7 D, @# @; V) b5 Q2 d' T; s1 |
<!--
. O& s I# h* a: {
function rv()
- d: L, W) i4 M) {% e4 L
{
$ E# M3 J( C# x1 O# r$ U: k
var val="";
" U. m: Z/ W: ^" B" U$ u& y8 m
for(i=0;i<combo_box.list2.length;i++){
5 W1 d5 B9 W8 j7 n3 C
val+=","+combo_box.list2
.value;
1 y. r% ~7 e* V5 n4 b
}
& P2 w/ K0 } C# o) r. B" D* s$ x8 q0 I
if(val.charat(0)==","){
7 I& V) q; ?8 g5 u& @
val=val.substr(1,val.length);
# `1 s: q: D# I. O3 o% N
}
6 q# n+ q5 e/ V1 M$ R" X
opener.form1.frecname.value=val;
- n0 ?) |9 e1 _+ R
self.close();
% S5 W' {; x3 j+ b$ }
}
0 c& }! |" y. \6 ?( n" F
//-->
+ S1 {' y% i+ s- V7 G
</script>
" ]% p" d" s* @1 w3 M5 d. I
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
. ^3 c6 t* N& a1 I) K2 g
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
- D" y- k D9 i1 ^: l5 w
<%
Q+ h, M# p4 ]/ q, v9 p
cdatasource ds=new cdatasource(); //数据联结bean实例
( {+ b R' q( R8 r$ s" U' L% H
java.sql.connection conn=ds.getconnection();
5 V& ]+ \- |7 H, y* j- Q) D# l: I
java.sql.statement stmt=null;
" B* V, H0 A- E) B m% A- i
java.sql.resultset rs=null;
2 ?' K! m/ M: H2 T: P1 w* M" o
cdatacheck dc=new cdatacheck();
: M2 t# K# a# h" R; N
%>
+ [" ^+ I$ V- k$ y: M) T
<%
. b- n& G: A! f! t* B7 x8 q S
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";
: ^0 c' {% L/ V' {8 ~
stmt=conn.createstatement();
6 [& w H$ q' n* S' e/ B1 o2 p0 k
rs=stmt.executequery(sqlu);
, n, t/ F# I" @- q
%>
4 p- h3 H6 W' _
<script language='javascript'>
1 q9 f! ?4 ]7 z6 }
arr = new array();
0 ?+ l) o( D: ? N
<% int temp=0;
) b- S- Q+ H0 A( P# K
while(rs.next())
8 t0 x( l, i# r8 v) X$ s9 k- c
{
% g- G" [2 v6 w% ]9 M6 D
%>
* z( I" A$ X+ _% K
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
6 L, Y% g7 N) F4 ^
<%
/ y+ ` r7 `: l$ H
temp = temp + 1;
}4 p0 d( M) d: R. ?1 O) g* W: J
}
1 B4 R* o" }! t/ T
%>
2 C% A) n& F2 W
temp=<%=temp%>;
/ A8 ?3 L6 y8 T0 E# S8 u7 w( u' S
function changelocation(id){
6 ?1 Q3 g3 q4 e- v
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
8 X8 d4 N4 @4 h7 `2 i
var i = 0;
4 ?* p$ r( z- l, C% D* j1 s" t
document.combo_box.city.options[0]=new option('-------','');
) R& G) ^( j% I _+ ^" w3 Y
for(i=0;i<temp;i++){
6 m$ V6 H0 J' u: |+ r1 O5 d
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
$ W1 i5 y- m5 d j: L7 D7 L' ?$ M
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
8 s3 y! r6 ~: n8 d0 ^1 M8 G
}
) K( h# y+ }" ^4 v" O, p; Y
}
+ m; c6 b8 C9 k, _
}
, H+ F9 ] c, G- a! ~( U: V
</script>
1 X# y! J+ c0 i4 D
. B; Q" X1 ]/ D! d
<form name="combo_box">
5 P! z% w3 m5 a! e: k' }1 o `
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
# O- c7 {$ O7 n7 y$ d* J: W
<tr height="24">
: ^' v! i% @) L+ K1 v4 J6 a8 @! p7 P
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
- b: [- D9 u) L- z* Z; N
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
! A: N M. _, B2 T' S8 u
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
4 R# C9 B6 ]6 B1 W- X2 S9 ]
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
# r4 `4 h) p$ O2 m5 j" O8 o
</tr>
6 |8 `5 E8 _$ q" G" U$ }, W. u
<tr>
0 [5 O* V7 Y9 Y( J' }/ ^9 V. \- V
<td>
, K" h5 v3 p! ~6 b. Y
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
) X Y7 y" f- T' J
<option value="0">请选择部门 ---></option>
6 }) L% i* h; A6 ^4 Q# q; k/ q9 v
<%
& \1 H! ?( t8 V0 X
string sqld="select * from tdept";
4 l8 W: g" f8 P: j
stmt=conn.createstatement();
8 _( v. [4 l' N2 b4 i! B, x
rs=stmt.executequery(sqld);
$ W! R$ ^$ K2 @& n- x# p8 N
while(rs.next())
7 n$ f* q$ n w: a/ x3 S
{
7 r2 K) u1 e) @$ a6 }/ ^
%>
; ]2 u/ E9 S" e6 O. y
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
: h; ?* q1 Q: u+ C
<%
0 ?$ T) }8 y0 S. v% {8 ~
}
1 o2 ^0 C0 C! X3 v- g* Q
%>
* {/ j. h$ n* J" @! \
</select>
2 d) O% q8 ], m ^# a
</td>
* \' v1 h5 c: ^; a% U* ^0 c/ _* D
<td>
, l2 I6 X: Z# \4 U, Z" @
<select multiple id=city style="width:150;height:200" class="bgc">
* d6 T9 l$ B8 r2 i m
</select>
1 g- d S# J) R2 q) N
</td>
d' {% U7 { l3 z+ l* r
<td nowrap align="center" class="bgc">
( l8 i: w7 B! o- b( e2 k
<input type="button" value="<<" class="buttons">
8 u6 C: q+ t0 ]" ?. t4 C# W. _
<input type="button" value=">>" class="buttons">
" d; P I3 h+ z8 e$ y+ K6 ?
</td>
# p) P# z2 M4 G1 F1 a
<td>
7 D& b6 I! C" P) P
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
" f0 g, t5 S5 ~+ a. m2 E
</select>
* W ]# M/ g# [& O$ F
</td>
3 w/ K7 X; P4 G
</tr>
! L4 Z# I3 r) }& i1 `& A8 K2 w
<tr class="bgc">
6 H2 o8 ]. f% d ]5 N5 w% p) v
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
( K! h& F8 \' z
</tr>
8 z2 x+ U* r8 g$ s5 Q5 z
</table>
4 A2 r4 ?( o/ j5 J |+ @+ S+ B8 s F
</form>
- J9 P- o4 n; J. h
<script language="javascript">
& I/ w6 I, {( `3 x, T4 H5 ^
//人名移动
0 l6 [$ j! y# G
function move(fbox, tbox) {
6 W; l( ~: _( s+ B
var arrfbox = new array();
6 M% `: x; A* Q. ]2 E
var arrtbox = new array();
. c& |! v D9 A1 ^
var arrlookup = new array();
+ W) I% q7 j9 d; [. L
var i;
7 Y K2 l: b5 ]' k! x6 ~' Y; H; [8 u2 D
for (i = 0; i < tbox.options.length; i++) {
* ~0 d' N# Z5 p+ R) G' p
arrlookup[tbox.options
.text] = tbox.options
.value;
: c' P8 ^( L, V4 f. \ F, v
arrtbox
= tbox.options
.text;
+ p% e5 H) q$ g5 Q- z2 G0 [+ p/ V
}
7 R$ a9 {2 j, ~& o+ |6 T( c
var flength = 0;
7 D' e& I3 G9 r
var tlength = arrtbox.length;
5 M1 ]7 w* Z7 O4 p2 g
for(i = 0; i < fbox.options.length; i++) {
* Y- H. o/ H* L F, }. }& D& n
arrlookup[fbox.options
.text] = fbox.options
.value;
7 ~3 f: b8 G* E b: P: u
if (fbox.options
.selected && fbox.options
.value != "") {
0 g; ^: q: h4 E
arrtbox[tlength] = fbox.options
.text;
. F8 P3 B+ R- r- Z
tlength++;
5 R) K, ]1 \3 K; l
}
( ~6 r3 {/ C. p9 ]* {- z
else {
5 o' a9 s4 A7 s# E+ ^/ J" J
arrfbox[flength] = fbox.options
.text;
: J1 ]1 _# H. L1 u
flength++;
$ |8 ?/ J/ k% R; u; H' `
}
1 u& H/ o) m9 G' ~& P
}
# @( u; x" F7 s# Y% A+ q$ N1 v( S
arrfbox.sort();
9 ^( O' D0 ?0 V4 \" r, z/ y" X6 f
arrtbox.sort();
/ \ r( w8 h$ o9 {
/ G7 c2 o# i: ] U3 r$ y: l
fbox.length = 0;
$ `' j4 |4 S. L& ^1 Z- Z' w
tbox.length = 0;
4 ?6 l: ?% [5 f8 Z2 ]& c1 Q3 @
var c;
* q* l4 W9 ?: V" w% _
for(c = 0; c < arrfbox.length; c++) {
2 v/ T1 z( Q- I9 C4 n
var no = new option();
# `0 b0 U) X# [ [! X
no.value = arrlookup[arrfbox[c]];
( ~* o% k- B& i2 J' Z
no.text = arrfbox[c];
' Q/ @6 {- u& R" Y4 N
fbox[c] = no;
$ e6 B; K) T8 f& r
}
' K; c% I l9 X* U9 Q7 s" c( g) v
for(c = 0; c < arrtbox.length; c++) {
* c/ p8 u" V1 {4 Z% O. I0 F
var no = new option();
; Y2 ]; R+ v$ u
no.value = arrlookup[arrtbox[c]];
" v3 _. }/ l; W/ q9 s, @. ~$ H7 }
no.text = arrtbox[c];
3 `/ D, E" l8 J% ?$ L
tbox[c] = no;
$ a5 M- ~5 P% E3 G5 r
}
+ `+ R/ d3 o J$ |0 ]( s
}
. a6 ?2 f: |4 ~/ B" _; p
</script>
' S! h7 G6 n3 i4 g8 k0 D9 r; L
</body>
; C% Z4 Y2 }* u, M N7 A. S
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
