标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
) C0 t V' R: c6 M. n, Q1 P
c pageencoding="gb2312"
8 Q ?3 \2 H1 W* p
%>
+ K6 m5 e* _+ K! ?9 p7 R
<style>
% y- `+ d' ]& w8 v0 S
.f9{ font-size:9pt; }
$ F8 F( S7 M4 J: s: q& N D* n
.bgc{ background-color:#aecaf9; color: #0033ff }
" k. y6 `) b7 X: t3 U
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
0 j1 R' Q8 p( b( }1 K5 i" ?& N2 R% }. y
border-bottom: solid 1px #4e7dc1;
% K% N8 U/ H' D+ G1 |$ y% h
border-left: solid 1px #aecaf9;
$ F: p$ u" C" D/ w ~9 Y
border-right: solid 1px #5679bd;
) j+ Z2 |/ i7 R: i% S# s
padding:1px;
0 \7 F/ _3 v1 i% O1 T) ?8 x
margin:0px;}
2 }; `/ J+ Q1 s# A9 [
</style>
% |& L5 G& R d
<script language="javascript">
/ l. p( F' j1 w. Z$ g1 }
<!--
, m% ?" ]" G# h( O
function rv()
. U2 K5 z8 h! h/ }0 i
{
3 X1 u: U: S+ t- E+ {0 h8 w
var val="";
9 p6 h8 z( T- f5 |0 @" b
for(i=0;i<combo_box.list2.length;i++){
/ B" W8 |; C1 ^5 s9 T3 g, K7 F. y t* v
val+=","+combo_box.list2
.value;
; X$ t' v% N6 {/ w
}
/ t2 Q; f/ V5 b; Q
if(val.charat(0)==","){
% c% |$ c5 z$ _5 w6 Q1 b
val=val.substr(1,val.length);
/ J4 X! [! O0 Q: W8 n2 m
}
+ I# Z4 O+ c. {5 u0 ]& j
opener.form1.frecname.value=val;
$ d" f" ~* O1 d0 ^: K6 _8 m, D
self.close();
' ~1 n9 v6 I9 n1 Q! V# l
}
4 I# I! H0 f& ^0 M5 T0 f# j( w
//-->
3 F l8 Y0 i! o! j
</script>
: ~& ?$ h1 h5 \! K
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
3 W' I& \- K: c3 O3 G
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
4 x# B2 ~6 W! Z+ N' i3 \
<%
' s& W. O) V! A* s6 d6 ~) i
cdatasource ds=new cdatasource(); //数据联结bean实例
: ? U% `) ~7 j" D5 }$ N$ W
java.sql.connection conn=ds.getconnection();
) K3 N0 i- _. Y/ \, P
java.sql.statement stmt=null;
" f1 ]' s) c2 J' i! t6 y4 }
java.sql.resultset rs=null;
9 n4 [) ?* w8 h
cdatacheck dc=new cdatacheck();
- A p6 ?5 w2 c8 H- F! f& O
%>
$ v. h2 M# l7 j. P5 ?* I
<%
# }% K% a" w. 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";
4 n9 E, k0 W. |, v1 X
stmt=conn.createstatement();
' K1 K2 d" U- j6 e" R# \: `. P9 @
rs=stmt.executequery(sqlu);
' @# ~9 C3 U( l1 q1 \
%>
& f. F) U8 L$ t; s
<script language='javascript'>
* K ?; M; m; p% m" {& { G& b
arr = new array();
- B% g1 d. a& ^' W3 _
<% int temp=0;
7 `$ t/ k/ E) i- |% u
while(rs.next())
8 Q. X3 A. ? {
{
$ L7 b8 E6 U% l% V- P
%>
9 G, @* b( d+ v4 p/ x y+ p) v
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
1 C% ^0 s* o! }2 n$ y' y
<%
? ?$ U' h& c- j) x( X# Y, F
temp = temp + 1;
* ~! F2 `6 u8 G; Q* n0 H
}
; {- m9 V5 a' E! Q; T9 w8 ?
%>
4 f3 x) M. O- w8 X8 _6 y) D
temp=<%=temp%>;
( _/ K" L8 {0 ~# X4 B$ i
function changelocation(id){
, |5 r' c& A0 v. q0 Y' ~7 h+ C
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
* M- F( B2 {9 S& R
var i = 0;
1 ]6 J' U# P, n7 {/ c
document.combo_box.city.options[0]=new option('-------','');
) D8 y* c* k( b6 W) w; v, S
for(i=0;i<temp;i++){
: K% Z, n+ p8 i& D5 o5 a4 }+ D+ l
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
5 F$ l/ I3 {' D/ ^( t" \ l: @
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
) f: E% T2 ^# t
}
/ g6 P& r& i" a/ l; ?
}
. }, |' A) U! @8 ]) x
}
% V* l! r" s$ M- R
</script>
$ l7 D: w# o3 c3 W/ [5 I
1 u, y' U# N: ?& N8 _9 J( r! e
<form name="combo_box">
0 l, R2 F3 \0 `
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
: q2 L6 ]$ |* f- c) U! f
<tr height="24">
7 `4 X# k/ ]" x6 ]9 M
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
. d. S! ^+ ~% f. x
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
4 R$ A4 F! M$ @& f" \4 c) A( R
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
$ u- W$ R5 R- F4 I0 c) ~
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
) o/ `' {% b' B: a- U
</tr>
: R) O& @, x* s9 _5 T
<tr>
* ~8 q; `+ J* {' i! f( l( b
<td>
' f# }" ^7 Y3 `" }
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
, c/ z. V% s& m! R) v
<option value="0">请选择部门 ---></option>
/ ~" R0 t, E% l0 K% H/ F
<%
J! R" U6 I- u0 `1 N* a
string sqld="select * from tdept";
7 S( m* V; }1 L
stmt=conn.createstatement();
/ b" }# I3 H, C% `
rs=stmt.executequery(sqld);
6 _9 n8 L% T/ H0 ]! ]
while(rs.next())
& q" N& y& L- P3 }( ^; m
{
' T# O, _" y/ X+ ^: r
%>
% h0 @9 q' |/ q5 t3 b2 Q }6 {
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
* ]7 p- l9 ~ y- y
<%
, t" ~( F2 A) \6 @
}
- k8 s+ \4 ~! d$ @- ]
%>
4 R' [6 h- L# v' g$ u! C( W
</select>
% j7 x5 R2 F7 g
</td>
+ h3 A) Y& N, J5 x7 M; U A% `! E
<td>
' @9 o+ N1 |- g' a! y1 V+ t
<select multiple id=city style="width:150;height:200" class="bgc">
* @, F0 ~4 f; x5 ]: ?8 l' e
</select>
$ ~& C ~! k5 ]) \" `: i# m
</td>
5 N: p8 z; m, }! ~3 b& r6 L
<td nowrap align="center" class="bgc">
1 [" @4 ~: V$ J
<input type="button" value="<<" class="buttons">
# _, t) `, k, U% n" b
<input type="button" value=">>" class="buttons">
5 i8 B* e' }# e
</td>
7 h6 {8 O! r! Q+ u3 V x
<td>
! i @0 Q" H, Q. {3 i" O
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
) ^' d6 @: S0 J# Y; \$ T8 c
</select>
/ k+ E0 f' R+ E3 ?) F, r' x6 n0 b
</td>
% m" H3 N5 p$ P0 ~4 m& X" B7 D
</tr>
7 l0 {7 y; o' E& H. U" F
<tr class="bgc">
S( t9 J5 N; M( g n5 W: `+ o
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
: |! m: J: W- v
</tr>
8 B$ y: Y n' w& G" ^+ N# w4 S, n
</table>
8 [7 w l$ P) _3 c* x# k
</form>
$ j; ?# z t! p' t
<script language="javascript">
2 i! ?# F& r: Q5 w/ c0 d
//人名移动
: x9 {) ~9 Z6 x; z
function move(fbox, tbox) {
+ E4 R# \3 ` F1 G. Z
var arrfbox = new array();
, }) Z% o. ~0 i# u1 S
var arrtbox = new array();
5 K# `2 C, X5 v: c
var arrlookup = new array();
9 a6 X! I# x5 ^5 f. s
var i;
) K8 b) Y8 ], V+ ]
for (i = 0; i < tbox.options.length; i++) {
5 ?# x8 Y+ y2 @+ p* ?) |; R* P8 s
arrlookup[tbox.options
.text] = tbox.options
.value;
% l3 b: E4 T4 |) w5 H
arrtbox
= tbox.options
.text;
2 i# F% R! k' f0 G" t# u6 Z
}
: Y# ~7 R' \; r% e+ F* W1 G0 T% G
var flength = 0;
: h8 r" v F7 V& x, u) H
var tlength = arrtbox.length;
- x g+ A d: e* q6 V! L
for(i = 0; i < fbox.options.length; i++) {
t; s7 p1 P4 U, C$ E$ f7 A$ y7 I0 e
arrlookup[fbox.options
.text] = fbox.options
.value;
/ n# t* C0 U9 x
if (fbox.options
.selected && fbox.options
.value != "") {
: Q! U9 U2 I- Y. y# s
arrtbox[tlength] = fbox.options
.text;
- a, v5 l/ G) @6 I
tlength++;
8 ^& J* Q4 e! T
}
6 ^" J% N; x! _% W( F2 C- T( n
else {
# k3 C- i3 s+ s4 B1 `; b t
arrfbox[flength] = fbox.options
.text;
! o3 M; Z/ k4 h5 R6 b' o1 r. `
flength++;
j( Y* F& ~" t. E m
}
9 ^, ~% p2 l% ]# d4 R% T
}
3 @# o, ]' a4 F/ z6 @
arrfbox.sort();
! l+ |* p3 _( _& O0 r1 {( O
arrtbox.sort();
# v H b- I c, Z, Q( R2 L6 ~
( ^4 p# V% e3 ~4 a+ `6 T
fbox.length = 0;
8 o) v3 H+ T2 \4 U% ^8 Z3 f6 q, C7 S
tbox.length = 0;
6 P1 T1 Z( B! o& B* Z7 }8 w
var c;
3 u' @. C# L: q3 S4 r+ f9 f P
for(c = 0; c < arrfbox.length; c++) {
9 T2 @' ?+ I. a% K4 S3 B8 q" X
var no = new option();
! G3 G) ?7 a0 @. |( _; A
no.value = arrlookup[arrfbox[c]];
! b! s, y0 i( | M9 p; z/ Y6 h, W
no.text = arrfbox[c];
1 g" t/ W& I1 {% F7 I
fbox[c] = no;
6 R1 i$ t5 d: ]& G, S
}
0 {, d+ e% `/ j# r* Y$ Z S
for(c = 0; c < arrtbox.length; c++) {
$ x! ^$ g* z8 j6 S
var no = new option();
. X I* _7 _* n) b$ L0 w
no.value = arrlookup[arrtbox[c]];
& F! [- _- A$ p, h( g! ~
no.text = arrtbox[c];
3 ?' J) ?. j5 w* Q- V g
tbox[c] = no;
& v* N$ p( B) N: O+ i) U
}
# w( x# y& `% L- A7 L" B4 B, W) n
}
0 j" U. R* ^0 Z6 w
</script>
6 E6 T) ^( ]5 n. [' \
</body>
- R2 o n" Q" t: [
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
