标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
9 o- G8 @ h$ i. u; m- [/ A9 z0 a
c pageencoding="gb2312"
( M1 q- a6 l& w% G" E+ _6 H
%>
}- |+ l1 B- d3 q: n5 S, o
<style>
( t1 m$ p- J* e* u9 f
.f9{ font-size:9pt; }
* R4 [/ X4 `) c
.bgc{ background-color:#aecaf9; color: #0033ff }
- I1 t' i/ v0 I0 t: h
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
9 k, v8 D. {. A @+ P0 G
border-bottom: solid 1px #4e7dc1;
6 c- c+ _. w" I; D; W# h7 E
border-left: solid 1px #aecaf9;
1 t$ I) d1 T. J) ~
border-right: solid 1px #5679bd;
0 Q& o' l8 h6 q% a5 l
padding:1px;
9 D2 x- b6 [- p
margin:0px;}
! b0 C9 R, f. W% Z+ M& k
</style>
! X0 V( P5 Z% k* I
<script language="javascript">
% o* a; _2 Q$ m
<!--
# d) ~6 x. y) ]/ @" |- t3 ?' { c
function rv()
+ k6 {$ F& N! l5 q9 L( z8 T
{
) C9 v9 s1 _1 Z0 ~
var val="";
$ `/ U8 }4 \, G7 b: U, D5 A( Y
for(i=0;i<combo_box.list2.length;i++){
! c; S" K% [0 I+ H8 x9 W+ @
val+=","+combo_box.list2
.value;
& M6 _2 T0 h( \% c2 t' u+ O, G# ]* `
}
4 T7 c2 a: L1 B+ S
if(val.charat(0)==","){
1 c9 V: l( I: R/ w1 L4 m
val=val.substr(1,val.length);
3 d3 T1 Q5 u6 w- i2 K
}
/ K6 E9 t9 [5 R
opener.form1.frecname.value=val;
R: j) N( a- N8 }3 v0 G* E
self.close();
3 w* b) i* c' A: d/ L
}
' Z! h4 K) ^. `5 _3 ?1 ?) R
//-->
# j# }3 u5 H2 y
</script>
+ m- c9 q! ?; S- G( A
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
0 o$ J/ Y/ {9 C, {
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
, w- m+ \& p( j
<%
; O/ B0 R+ P5 S! n4 R
cdatasource ds=new cdatasource(); //数据联结bean实例
; ~: i' U' K9 H6 @
java.sql.connection conn=ds.getconnection();
$ P' z& z6 ?! z% E
java.sql.statement stmt=null;
8 n6 S0 l" p! B- ^
java.sql.resultset rs=null;
/ k' I6 l" a) |; e, Y
cdatacheck dc=new cdatacheck();
/ w, v8 d- p2 @- b8 z) N6 ?7 B; d2 t+ \
%>
6 d1 c: k5 W5 y$ w! j% i) K
<%
. Y1 {# x- t7 K! M" X1 t
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 `# k B) O, W) U |# A5 B- b
stmt=conn.createstatement();
5 b, w0 S4 z1 E
rs=stmt.executequery(sqlu);
3 j; L# f2 z" g4 M9 o! O5 T3 P
%>
9 e1 u1 R: D3 } [, d
<script language='javascript'>
" d. Y1 L& t$ J7 {; B
arr = new array();
7 w( f9 N7 t5 K$ @ y( |7 Y) t) i% R
<% int temp=0;
, C* W4 p" u6 U* ~% ]) i* g
while(rs.next())
9 h" Q5 ^* v/ q# v
{
* M# ^0 `# a4 K) B
%>
/ E6 | V, p, ]9 p
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
2 W& {9 o: Y$ d# ^, O2 S; e
<%
; d* N0 b$ Y( z0 ?& a( G
temp = temp + 1;
, g. m6 {0 x; q5 N% a7 @( k# J
}
6 h, K: x ]9 k2 o9 n8 T6 f+ I6 R. K
%>
# F8 L, X( T& b5 a- \) @) f2 m
temp=<%=temp%>;
: Y3 Q- ~) f9 @' u5 {- M! X
function changelocation(id){
) g/ J, z- ~) o" w- s
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
4 g7 h* W' D+ @8 x7 |+ _
var i = 0;
6 Y/ K' u0 |' y' a
document.combo_box.city.options[0]=new option('-------','');
; ]: ?0 i! ?- g7 ]3 ^
for(i=0;i<temp;i++){
+ v0 g% }; h. c; K7 n; Y; h- x
if(arr
[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
3 t2 w% d2 N3 F: [" G
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
, `3 w( B% U ^1 Z7 J: Z
}
2 g3 Q# c* c: ~
}
1 T0 A/ G$ W* @6 L: y) l6 x
}
0 G' t2 Q' Z0 R( ~: F; t$ b
</script>
" Y' u4 Y1 l) p! s
/ }/ ^+ k b, P. U" {+ A1 q
<form name="combo_box">
* u3 o6 W+ B1 y! ^; w' W: K# Q5 p- g
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
& j2 ]# m4 A+ o# `4 K
<tr height="24">
( a: B. U- p( _
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
- C" C6 ^; T$ r9 j. ~6 \
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
0 L7 q/ @% Q& z: }" j* B
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
2 k7 D- _1 |* n/ }7 S* V
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
( ^4 y/ ?$ q7 O& o, @5 g
</tr>
1 w/ A: ^: R3 |1 ?; L
<tr>
6 Y5 c, [6 w D/ [8 Z0 s
<td>
8 T8 S9 X1 w: h: A' v' H: g' v
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
0 S6 w, m5 K" _' C- }
<option value="0">请选择部门 ---></option>
. w, @: e% a3 B9 p7 r
<%
* s( N, n) p: H9 r
string sqld="select * from tdept";
: r6 \! ]2 ^6 e8 [7 t1 h7 J
stmt=conn.createstatement();
t0 |6 D9 U2 k: }- y! F
rs=stmt.executequery(sqld);
* j; _3 R6 j$ h ]
while(rs.next())
9 U, M8 N' g; c* V) l$ A
{
' f3 X5 P+ V* {! k- J# J
%>
) [, k$ L- }0 d. n) t
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
: q2 N' G1 f+ J4 V
<%
7 g8 p L, t: H8 f- e4 K8 I
}
/ F. q6 p; ^, l
%>
( s6 e. o+ C/ F) h4 c! V1 v V
</select>
/ W+ _$ n0 X( q) U0 `* ~; x7 C2 `. N
</td>
7 ]# d" E3 A' y/ w
<td>
: d: G* j- m% |; D: ?( z
<select multiple id=city style="width:150;height:200" class="bgc">
/ ]0 j! K# ^2 a6 G3 `) j& Q
</select>
+ H. ^# i' Y k! ~; f" @1 r' r
</td>
& U! V! ]6 M) m1 D; r
<td nowrap align="center" class="bgc">
# t4 i2 S8 e" ~ e
<input type="button" value="<<" class="buttons">
/ B8 G2 ^% p) K( c# w. V! D% a
<input type="button" value=">>" class="buttons">
, }8 l3 D1 E1 ]# G! B; B3 H1 A
</td>
, G. N4 V# V# {0 R/ [3 n
<td>
; T" v: B( @$ a) R5 o" ]! T
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
8 ]; Z0 Z# R% l! c
</select>
! h. l4 }; f' K5 ?
</td>
/ B: x: q( |: p! a v$ g/ _
</tr>
0 d5 L6 O6 I2 f' ?) D5 G* {
<tr class="bgc">
0 Z; p! a6 }% D5 T, L
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
' I2 B5 w& [9 d8 I) c
</tr>
/ w& h/ P9 l/ f/ v
</table>
& n" z' L' ~7 m3 u
</form>
$ @( Z, _+ D' o. F2 J5 T7 w* t5 f
<script language="javascript">
/ f# t8 Q5 p7 ~8 O
//人名移动
1 H. A/ b3 ^8 [) Y0 j3 d3 {0 b
function move(fbox, tbox) {
7 i1 V9 m7 E, M0 D3 t) y; O% m T
var arrfbox = new array();
8 r% [, }+ ^( B% ?0 D& b3 ?
var arrtbox = new array();
# B8 |( V, m3 {: G! a' I
var arrlookup = new array();
( i# j* a7 _& i7 t2 F2 J
var i;
* E; @& B7 U j' N
for (i = 0; i < tbox.options.length; i++) {
( F- ^" l8 k. H
arrlookup[tbox.options
.text] = tbox.options
.value;
! F) {) o, y) V6 R
arrtbox
= tbox.options
.text;
. ]5 V9 t$ s; g2 ~" Y5 u. W9 F+ |
}
( R+ G. j, c8 P
var flength = 0;
8 V8 P; w2 t! u
var tlength = arrtbox.length;
% A& B' l6 N% {. [
for(i = 0; i < fbox.options.length; i++) {
4 j+ w; I- \9 }2 g
arrlookup[fbox.options
.text] = fbox.options
.value;
4 r k1 i- E5 b \2 u& D) V/ w
if (fbox.options
.selected && fbox.options
.value != "") {
# s' y- y* ?+ z6 M0 _/ ?' v- d5 C- K) K
arrtbox[tlength] = fbox.options
.text;
, R1 x- l/ f$ j* Y' c# c/ W5 z- I
tlength++;
N# ^. Z7 w9 k, w7 s+ w
}
; N( G; c# K8 {* d0 T w7 F
else {
- m9 l0 H9 n. i: Z6 X" K
arrfbox[flength] = fbox.options
.text;
# b0 }/ q6 B; x5 q/ l
flength++;
( R% Q* G p; i1 T9 N( e3 H
}
+ `! l( `- O0 t' M( ~# M1 O, w
}
! |( b) ~. Z5 N# k2 Y* e1 F
arrfbox.sort();
" n$ I" M2 L+ M7 L. @. P. ~
arrtbox.sort();
( h% O/ X/ Y% D0 A2 \9 o5 x1 Z3 I# r
4 F* j0 b C+ \
fbox.length = 0;
3 M* R4 ~7 `* v
tbox.length = 0;
- e# F2 f$ B! ^% }5 T' R; w
var c;
: q8 D3 q+ l: m3 }' k
for(c = 0; c < arrfbox.length; c++) {
4 ~ l( F/ K( j$ e5 X
var no = new option();
9 v4 Y. J* Q& V* e0 |+ m. |
no.value = arrlookup[arrfbox[c]];
5 l7 N) J9 s5 ] [/ h
no.text = arrfbox[c];
* F7 o3 h2 q# T/ |& M( B
fbox[c] = no;
6 x* h% N! p* E5 Q, l) f
}
8 }0 q% J' y. N; v$ y7 K
for(c = 0; c < arrtbox.length; c++) {
' ?. o& }+ }% V" r9 ~
var no = new option();
7 _. N# B& w0 I+ ~
no.value = arrlookup[arrtbox[c]];
% B/ G9 b; |/ y
no.text = arrtbox[c];
& k( [: c- t7 n3 \- B& Q
tbox[c] = no;
& m/ ?( T) ], z7 a
}
; u+ ~# l8 T1 B' p$ e( o: q
}
! N) z& _9 n! J+ I! ]2 G3 V
</script>
# [# f8 [7 @( A& D2 ?8 ?" h. n+ n6 C- k
</body>
, k, J0 B \* ^
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2