标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
5 v8 p! j4 r+ j; M
c pageencoding="gb2312"
' |2 h( X$ I2 S
%>
8 @! T3 B' v2 W. A
<style>
8 h9 W+ \( R; e! W
.f9{ font-size:9pt; }
, b' c, ?6 k( U
.bgc{ background-color:#aecaf9; color: #0033ff }
4 Q: o6 A+ F5 T
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
( _( H$ Z, U5 U; b: g
border-bottom: solid 1px #4e7dc1;
) R5 W: F5 U+ i8 Q% ?
border-left: solid 1px #aecaf9;
- T4 ~3 o0 N' y8 ~+ y
border-right: solid 1px #5679bd;
- } y9 t1 X" }9 q
padding:1px;
4 `* _# e% A/ Z) _" ^9 y
margin:0px;}
4 X" A, Q0 A+ g p# R
</style>
1 ]+ [2 X3 H$ q. _2 k( z
<script language="javascript">
* O' s) O8 o7 \8 s
<!--
: o( x n) g' Z1 f5 z7 u p
function rv()
J5 K( c4 v; `4 ]6 T# W) c9 I
{
9 k/ t4 J( S/ s) c, G F
var val="";
& |: g; v4 p; n; {7 r1 P3 x
for(i=0;i<combo_box.list2.length;i++){
( ?0 _# N+ N, S8 ?3 [! q
val+=","+combo_box.list2
.value;
/ N! P9 B( ^- b6 G: o1 X
}
, u* w0 w2 I/ q: Y" K
if(val.charat(0)==","){
# i" b6 E V2 k0 q7 d
val=val.substr(1,val.length);
8 K& i" ]3 O8 u" [
}
0 j" F6 T8 [/ P; f
opener.form1.frecname.value=val;
- a- w) x( i0 Q. e
self.close();
d) T" O5 l7 L' _" P8 Y) h: i
}
: S4 R! D& P' P* ?( d& m: @% [( ]
//-->
/ U; v* W8 n; S8 W9 ]2 A5 c/ F
</script>
7 v* i# j4 Z) R* ^+ Q9 X: s6 x
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
8 g; T: s6 K0 O" ?2 P$ }$ s
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
% x- E/ t6 i. H1 r m3 v
<%
5 T3 O. O5 H+ B# h
cdatasource ds=new cdatasource(); //数据联结bean实例
: p) e; L( L: Q: s5 j
java.sql.connection conn=ds.getconnection();
" M# n0 W5 W( v
java.sql.statement stmt=null;
' e: j2 W( {/ ^8 t1 h1 d" y1 A
java.sql.resultset rs=null;
# n3 U! [5 ]$ d6 X: m
cdatacheck dc=new cdatacheck();
% ~ ^& T/ n+ ~+ o# K- r1 b2 I1 {# z8 s
%>
! X4 y* X b3 O& J9 n* c: ?( P
<%
; x3 Y \- v- i2 Q3 ^7 G4 W" N
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";
7 x! X7 u/ ~3 _$ l+ x/ V! A: c" g" \
stmt=conn.createstatement();
' M, y7 U. c' I. n5 V# y! ~* x
rs=stmt.executequery(sqlu);
# `, e) o: n) q( Z% f7 E
%>
1 j% j( b" c) G7 W3 w
<script language='javascript'>
' S" [5 m$ M' w% l; s( h
arr = new array();
7 ~; G, h1 |& h
<% int temp=0;
. i, o! ?8 v* Y8 A
while(rs.next())
; ?$ O& I% d# [
{
# k3 i- X: Q* `, U+ L$ L
%>
2 g6 k! X6 k: k6 f( c
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
5 E4 Q8 ^6 }' t) i6 V( I# Z, o
<%
, V7 U5 H& _: B3 \+ l( g2 \
temp = temp + 1;
& }; O' A! a$ k
}
6 H/ f7 j4 H* t/ t ?
%>
3 \- p5 y6 ]% w* Z. r
temp=<%=temp%>;
% d! P- G1 A. C( y/ L! ?
function changelocation(id){
& G: C1 D E( r1 P9 ^1 ?! _
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
' B+ L' J* U! C$ E0 M N
var i = 0;
4 \/ i8 t+ Z9 f
document.combo_box.city.options[0]=new option('-------','');
; w$ q" `8 T$ [/ G" H5 l
for(i=0;i<temp;i++){
4 M8 v0 k0 G: Q6 Y5 f
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
! C! Z9 z* ?% R6 V& o5 G
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
' ~- c" a6 z; r, q- e1 b- i4 b* n
}
. `/ F/ W. Q; f8 |) S% d& N/ t' v
}
" g6 ], M5 C+ [! n3 e* C
}
4 X6 R0 v3 K5 q: u3 p
</script>
) Z. \) P/ b3 ]4 ?/ s5 X, @8 s' }
1 z+ Y4 ?. q* e; R9 j4 ^$ O7 F. l
<form name="combo_box">
" A9 U. D+ H1 e% h" Q
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
" E" b6 `9 O& G4 q* b( k- D
<tr height="24">
5 G* o* p+ a/ S
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
* U* |" n' l1 Z- x' j/ H
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
1 w8 Q; C- ^* Z- z( D1 T
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
- d# A2 P7 g8 h" _7 Z
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
. M1 J$ }4 N4 b+ n3 R9 q
</tr>
& `- n7 _$ K, E
<tr>
1 S. Q: S* w/ l" J
<td>
$ X3 b& [' Q8 Z( c3 z6 y
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
( F# K3 [4 @0 J: ~% U8 o3 @
<option value="0">请选择部门 ---></option>
' `9 h9 v0 r2 i' T( Y, I! ~6 t
<%
( i8 x; H ~8 \/ U' k, l: ^5 D
string sqld="select * from tdept";
m V; l+ ~2 z* @3 H# R' b
stmt=conn.createstatement();
$ Q" P, ^, p2 b$ K/ k7 F
rs=stmt.executequery(sqld);
4 b( u, n2 ~8 i9 W
while(rs.next())
3 H% ^0 w& r1 \7 C' m
{
; q) ?; T; s' s! s7 W |# N: A# v3 V& g
%>
1 f/ R: \( f. F# R3 c& b
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
. D" k# T/ ^( W# Y7 {; j
<%
) g, z9 o- @/ b6 Q/ |( S6 c+ o
}
8 j: \" c, R# \1 e
%>
0 \: L3 V- s0 O" h2 l( U# [
</select>
/ | Z9 w, R9 G+ H7 P
</td>
0 M2 @% Y: m+ ~7 {
<td>
7 @( f4 y5 s$ }% f
<select multiple id=city style="width:150;height:200" class="bgc">
' I1 ]2 f6 @1 T! M4 y
</select>
/ l: L+ `+ z" x% Z0 S
</td>
7 g1 O3 N' E! f+ [! H' D, Q# o
<td nowrap align="center" class="bgc">
- w) ^0 G( r. T g
<input type="button" value="<<" class="buttons">
9 n, l P. j( N' G6 c
<input type="button" value=">>" class="buttons">
/ S: k* P) i, P" \2 w
</td>
3 |3 C: f p/ M2 n5 K5 D
<td>
# ~6 E& o8 O% v; h: T0 e# l
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
# P; e( }' ~3 F4 L
</select>
2 B8 c* N! Q1 E3 g# C3 ?9 ~
</td>
& A; P0 ]) B( ?) a7 b# t5 ^$ O, _
</tr>
4 E y9 U$ o# U+ V3 M
<tr class="bgc">
: F f8 B8 Z$ n9 u# W# T6 I
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
1 v: c3 F' A+ v! n
</tr>
# f8 v. ?' t! J( S% u$ _. n
</table>
6 I }4 t2 t6 A2 |2 C
</form>
# M- J3 k% G% C. Z
<script language="javascript">
4 l' O, l, X* N% h
//人名移动
8 L8 x$ q: o! _5 a
function move(fbox, tbox) {
' H2 {) c1 q6 r4 [
var arrfbox = new array();
. _" G; \- D! L. [4 {# v! ~
var arrtbox = new array();
+ Y; g/ d; l2 l1 b% Z
var arrlookup = new array();
% o+ p, a. | |" f
var i;
- }1 T7 K/ g8 ~8 n( `, z7 h: g$ M
for (i = 0; i < tbox.options.length; i++) {
7 R7 |+ G0 y) |: F2 I" |5 F$ Q
arrlookup[tbox.options
.text] = tbox.options
.value;
: e( p) N& x7 F; V# r( f
arrtbox
= tbox.options
.text;
5 }/ y" V* ~; q5 |
}
0 {, L3 v% r }# I: e% F) D" U
var flength = 0;
# R7 S" F+ F# z5 c
var tlength = arrtbox.length;
, Z$ c& N5 B) H- l/ }/ B
for(i = 0; i < fbox.options.length; i++) {
( N5 r- O! t+ ~- v- E% \
arrlookup[fbox.options
.text] = fbox.options
.value;
. E% ~$ t' d# @% G2 E
if (fbox.options
.selected && fbox.options
.value != "") {
1 m3 l8 P+ d; v6 `2 A0 ]9 O
arrtbox[tlength] = fbox.options
.text;
, P. z# X: `$ c4 U# }
tlength++;
. C6 `2 I/ J& `6 h, y
}
) L& f0 U8 q& t
else {
- s) s. T1 m, J) D) p, {4 u
arrfbox[flength] = fbox.options
.text;
/ }2 Z& c8 k5 `9 B" P* J- }
flength++;
/ g6 X, |* w1 Z
}
" O0 H9 P: {8 R& x, H+ \* u1 n2 l
}
3 z2 V6 ^7 G" U
arrfbox.sort();
8 }2 A+ u; Y3 Z6 b1 K+ p: T
arrtbox.sort();
5 d g3 \* n% f
) T0 P6 r$ a2 [- h, y K
fbox.length = 0;
. j; W$ v3 m& k6 G2 P- z
tbox.length = 0;
! O; A% j& j0 K) T. c% e5 w. y1 q
var c;
$ f3 s8 M7 z! i
for(c = 0; c < arrfbox.length; c++) {
: V& k: s7 j: ^7 C+ Z! j
var no = new option();
0 k; L0 K! M( Y ]
no.value = arrlookup[arrfbox[c]];
- ?8 S( e% u6 E$ D" l. J
no.text = arrfbox[c];
9 J4 a. h$ O9 m
fbox[c] = no;
+ Z. I; t& k8 d( J
}
- M* x8 u) w- D2 D* B$ b3 Z e
for(c = 0; c < arrtbox.length; c++) {
: |% H- }+ X7 A0 e# u; M8 J
var no = new option();
( N6 R0 F/ ~) p3 y
no.value = arrlookup[arrtbox[c]];
* C7 j. A8 N, X; S4 H
no.text = arrtbox[c];
9 a! i8 V; X+ j
tbox[c] = no;
8 T6 }! {, ^1 @+ ^0 Y) T
}
, A/ U5 a5 `- B4 w
}
5 T0 o0 S: [* H6 x; s
</script>
5 o- ]8 t4 q( h6 ?; r% F- z
</body>
( _2 _1 ~$ d& M4 b
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
