标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
9 a# c3 X! _2 r- `6 S+ I, t
c pageencoding="gb2312"
/ z4 C5 e! {# w8 |6 s% E& y
%>
# C: q. V8 A) V. O; v. g- H
<style>
) m7 d9 A9 N2 A- e
.f9{ font-size:9pt; }
5 j* _% `6 b9 w* \; T6 b( r
.bgc{ background-color:#aecaf9; color: #0033ff }
. B' \/ b3 x: {7 X
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
" t4 l+ j8 v4 ]% T+ H
border-bottom: solid 1px #4e7dc1;
/ H+ s" C6 M% I1 X8 g' Y
border-left: solid 1px #aecaf9;
: O% M. y9 S, a9 a0 J
border-right: solid 1px #5679bd;
3 P9 r. Q+ y& p/ K o+ V
padding:1px;
b* P# f6 ~( D# l7 ]; O. i+ J& g
margin:0px;}
! k0 Y6 H6 I x. a/ B: g
</style>
" q" k6 K/ @0 ~+ K- j* C
<script language="javascript">
+ K. U \/ v# | ]- H( E6 d. }
<!--
5 N9 G# Y9 V7 ?! m. `9 r
function rv()
' J7 N1 c* A, R
{
! w& D, A! X; d B* `
var val="";
& g" J1 T' D# l9 M( T% }9 g
for(i=0;i<combo_box.list2.length;i++){
7 G( h5 b# X$ q0 @% g& M; U7 D! W
val+=","+combo_box.list2
.value;
2 @8 N! d; F" S1 _9 g( p
}
. p$ L) A! C' H
if(val.charat(0)==","){
: C; }" @7 X# P4 H6 q8 `, g% Z
val=val.substr(1,val.length);
2 m. _9 d4 ?. C' s- U
}
: ^0 Y5 P) c8 P j. n& |8 t
opener.form1.frecname.value=val;
- ]) G d5 ]/ v) P4 w" g3 k0 B
self.close();
, L; D+ D3 y) X# W( X) x: r, @
}
; [5 V3 z. n: q
//-->
# p6 F$ |4 F9 |; o7 c) }$ A* c
</script>
1 V8 m: p1 A0 Q3 ^1 I& H8 U* P/ j
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
$ N% S7 K. J6 Z1 h' a0 R3 i# w
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
7 q4 b: ?# @- x! h( k! c
<%
$ \/ Z( V1 {1 v7 q1 I4 I* N
cdatasource ds=new cdatasource(); //数据联结bean实例
+ `* j6 j9 V; B! ^5 P- O' b
java.sql.connection conn=ds.getconnection();
2 |6 e' p, v+ |" u3 n6 Y
java.sql.statement stmt=null;
0 r. P! n- K2 ?& X# k* X3 N$ M
java.sql.resultset rs=null;
+ R' {- W) N# v( ~. x
cdatacheck dc=new cdatacheck();
a* V& x H/ o
%>
L( G- W+ j6 `5 N# |8 s* f2 c3 O
<%
. G/ E* d" v6 P
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";
3 K8 r, _: o% M1 W
stmt=conn.createstatement();
l) l' V& s6 Q* T* T
rs=stmt.executequery(sqlu);
3 E) z/ b. `! Y4 w
%>
" o2 o9 M9 [3 V: \4 B* s
<script language='javascript'>
/ i! R/ w) c' c' X/ E9 \) w6 v, d: Q
arr = new array();
7 |, a* c; |: d
<% int temp=0;
5 d! l' D/ b' p$ X+ p
while(rs.next())
3 r/ k) X* t. D/ p2 x
{
) L4 L! T ]) C' _7 ?4 P/ `
%>
1 o7 Z5 ]+ o7 x3 z/ a
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
* c i2 F) g' z
<%
! b; u- j; k1 ~( m& K1 d. {" O M9 i
temp = temp + 1;
; }9 Y9 v3 J. b3 A$ {
}
5 p. ]4 {+ f- | w6 T* X1 D$ F: K
%>
1 N$ J+ ~% a+ |
temp=<%=temp%>;
! O# n2 y& V9 `- K& S
function changelocation(id){
2 T& ^! w+ C0 x
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
, M l- R/ E, _5 b; n
var i = 0;
5 u' L1 y6 C; m+ A* V* V$ Z) _
document.combo_box.city.options[0]=new option('-------','');
; R3 |, |& V- t! Z; a }8 @+ g
for(i=0;i<temp;i++){
, ~; ]1 F# \" M/ t
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
( B" J& D1 T5 a y4 @, N' Z
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
: X" B5 z1 Y0 q$ v8 [
}
# O6 F3 [$ O5 B' N. H. k' D5 C' M$ ]+ A
}
( `, i# m* U7 T
}
2 O2 L( V, m U, h$ D9 b' Z
</script>
5 t0 ?9 t% w5 {% x- ^# y. z8 \6 c3 b
& }5 g$ o1 j& C2 ~1 P! B& Q ^
<form name="combo_box">
8 q& Z- Z" S' j
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
6 w; ?3 j! G$ m. e/ |, I7 k
<tr height="24">
[1 E* m1 x8 o, J- a) X8 X7 s3 t
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
% p l, E% }8 q0 c' A, y9 G% K
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
$ I; R+ A& L' b/ L
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
+ U9 y4 {% g; c3 i( Y7 k% |
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
6 r$ i* {; Q3 {$ {' ]) B3 F( T
</tr>
3 L3 g$ C. v. z" w1 y) k
<tr>
2 \+ F B) k4 k. X
<td>
, M8 w2 E F: g6 I$ T9 Z
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
% P, Z+ z$ B. m8 [9 P1 w
<option value="0">请选择部门 ---></option>
: H8 C9 m3 k+ V* F! v" D
<%
2 L% v- g: W; t- A( B& l& O! w v
string sqld="select * from tdept";
& s' z4 u. o8 I/ o3 l
stmt=conn.createstatement();
% u2 `+ D; ?" x" W6 T: [
rs=stmt.executequery(sqld);
$ D( r' {% Z! W5 E
while(rs.next())
! z. n1 ]) H6 `3 [
{
& a8 V+ X5 m5 [- K' m A4 Z
%>
" e5 A4 j# C" c6 i* L1 ?, i
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
% R E- {; \3 ]1 _
<%
6 D& R' |( p5 D' V( K
}
: v5 ] Y: G+ S9 N5 ]
%>
3 e) ~/ o3 x1 X& q; ^! N
</select>
w ~$ j2 t6 s) w6 K* I; I( J2 Q
</td>
! X/ s* L# |* Y& `4 |# Z8 o
<td>
% N1 _1 z/ H5 \- N& b
<select multiple id=city style="width:150;height:200" class="bgc">
- F- D. V ?/ }3 U% l4 e5 A
</select>
9 i/ W ?* U& i" T
</td>
! @& P2 ~ Q5 z* B
<td nowrap align="center" class="bgc">
' j" m/ S" b# X9 r* K j0 V; h
<input type="button" value="<<" class="buttons">
9 Y1 o# [" d8 _% w9 j
<input type="button" value=">>" class="buttons">
' g# ~8 N- r9 o6 w4 r
</td>
2 n) P$ g: D' d" L( J
<td>
% k/ `) Y7 } f9 |3 }
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
, l$ |" \; P) ~4 [! X3 j4 O; J
</select>
( j8 ^# z# q$ X1 N! }
</td>
5 E8 e g/ W' ~* n( E6 z) Q6 _4 b) m
</tr>
' o$ u+ q: U6 \, m( e" \+ _1 [& X
<tr class="bgc">
% D4 G# d. r/ j: `
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
0 c, q! X2 v* `
</tr>
' L9 q: @' b( W0 s! I
</table>
+ q% \' {8 J, c: o1 N0 H) j
</form>
, h+ ^" Q- [, Q: c6 }& T$ k8 ?& T- h1 F
<script language="javascript">
4 j$ x* L+ [8 u
//人名移动
# H9 p2 ]" r9 w* d9 S" q
function move(fbox, tbox) {
0 q8 s" r: T5 C; V8 R7 s
var arrfbox = new array();
# k# v: B1 W: p/ H, V3 [+ b' {: Y
var arrtbox = new array();
/ {* O3 Z. E" a& i* [* p
var arrlookup = new array();
7 z, e7 I h! B- x& {& m# W
var i;
' g+ N# Z5 u! x+ E
for (i = 0; i < tbox.options.length; i++) {
# q2 F) K2 M, I* D" L! a2 |% y
arrlookup[tbox.options
.text] = tbox.options
.value;
l% r) _' A2 u! \3 v6 b
arrtbox
= tbox.options
.text;
! s D! k7 ^! M+ S
}
t1 z0 i. I" ~
var flength = 0;
6 U( M6 E8 U5 g# U
var tlength = arrtbox.length;
& p+ z8 g* B$ m9 A5 i: d$ j6 o
for(i = 0; i < fbox.options.length; i++) {
- \" U6 Z- t. }; X% z5 c1 Y
arrlookup[fbox.options
.text] = fbox.options
.value;
0 p" o9 M* c4 Z0 h: e7 {
if (fbox.options
.selected && fbox.options
.value != "") {
4 k1 x& f& C) {5 x9 I5 ~& x4 D& l
arrtbox[tlength] = fbox.options
.text;
2 m( O" }* |) c$ `" @5 L9 Y
tlength++;
' L" f/ A" e7 t' m9 r) V8 u
}
3 C# t6 n8 g: Q: X
else {
9 B! i6 t7 w! x% o
arrfbox[flength] = fbox.options
.text;
* C9 h5 F5 F9 w0 E+ [# J
flength++;
5 {# S& z9 s& @8 Z; `
}
" u3 Z' Q3 E9 U9 B& c; @
}
* v: W" h, R5 X. n/ @
arrfbox.sort();
% i- ^. ^- ?- y, P! c$ m7 d$ T# V8 x
arrtbox.sort();
: ?0 D) Q5 D; O( e0 c
8 e9 t. x6 b, K; ^( f5 |0 w
fbox.length = 0;
. h( B3 l* q. A# l
tbox.length = 0;
% y+ k2 h* E$ {5 c
var c;
1 e9 f( Q& F) M+ u8 f1 z
for(c = 0; c < arrfbox.length; c++) {
2 D- E- m. t& D' W+ W
var no = new option();
" y/ [. F: ~7 d7 H
no.value = arrlookup[arrfbox[c]];
* c4 c, N! n' e
no.text = arrfbox[c];
( p7 K" t( Y B) C" v( ~3 a6 |* `
fbox[c] = no;
% I+ M% L6 ^8 h& A7 O* I
}
. U( R% l% B' c' x N0 O/ S
for(c = 0; c < arrtbox.length; c++) {
- W4 h+ Z* r3 |. a) T! s8 s
var no = new option();
7 \; T. \! C2 Z. B! ^$ k. K
no.value = arrlookup[arrtbox[c]];
: m* `2 R1 [; e) @
no.text = arrtbox[c];
# C' f# B3 W8 |1 Z
tbox[c] = no;
, I! @! z4 a$ N
}
G: ?% `, \, w6 t3 i+ c# Z
}
& T( w& t% \2 J/ \
</script>
$ x- x; I* T# `3 x1 u
</body>
6 {7 V# c* w7 ~" D4 x6 |4 r
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
