标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
+ c9 w1 u' I) l x$ x" O
c pageencoding="gb2312"
! q6 Q2 k5 [9 \2 S+ p$ \
%>
. h" ]& d ] `2 }8 f
<style>
( g$ c) P" k8 k+ q+ P0 K. c) C6 L$ n
.f9{ font-size:9pt; }
' J: J* m7 E8 H. W
.bgc{ background-color:#aecaf9; color: #0033ff }
% m6 |6 \1 z5 F9 {
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
7 }' k+ |) Q7 I. `1 P! K
border-bottom: solid 1px #4e7dc1;
7 H& m: L1 u6 s. w7 T7 J9 z
border-left: solid 1px #aecaf9;
" @$ k& @ U+ ?5 P" N, a" ` F
border-right: solid 1px #5679bd;
$ a8 H7 D$ p# z9 ^- z* h/ F
padding:1px;
) H5 J y: A6 {4 Z& Y+ o
margin:0px;}
; B( u4 z1 N$ U5 z
</style>
$ v/ `7 O0 `# R6 b( L9 o
<script language="javascript">
7 {8 U. a, O7 j- C& ~
<!--
K4 @- a* H5 n ^1 I
function rv()
+ ~: G, Q& |" N) [$ `+ B& v: E7 O
{
- q& i2 I4 ]4 K' J% P4 p# P' x
var val="";
7 o V, F0 x3 S
for(i=0;i<combo_box.list2.length;i++){
& O* J3 B: t. M' Q C
val+=","+combo_box.list2
.value;
1 w' K2 S9 c' v* K) @1 o
}
" w2 \7 G' o0 w* Q) i# X, ?% ]
if(val.charat(0)==","){
4 W4 c1 s8 ^, `4 `
val=val.substr(1,val.length);
$ ~8 x, Z6 C0 a, G( {, P
}
0 a7 z& ?/ h! V# q9 [9 T* u) C
opener.form1.frecname.value=val;
1 Q7 V! a ]* d) R- N. x+ H
self.close();
+ m* e0 J8 v4 J: t+ c& P
}
# E9 M$ L6 G0 P! D
//-->
2 m8 g! R' E# G, T
</script>
/ X. g Y* i3 w" t" \- S
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
4 m p9 X: u$ J1 f# j
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
8 V1 k- G, J1 A- B- x* y+ I
<%
) X0 H4 Q8 J) W
cdatasource ds=new cdatasource(); //数据联结bean实例
+ R; ^: p0 o B/ Q1 }" q# R
java.sql.connection conn=ds.getconnection();
% r) {2 ?! A1 T- v+ N2 y7 P
java.sql.statement stmt=null;
( R# S5 d! G$ o% z& E& e1 v4 B
java.sql.resultset rs=null;
" a2 X( v1 f. N* j' p: y; D4 S% o
cdatacheck dc=new cdatacheck();
! {$ C: m' C2 h) m
%>
4 |7 \( L1 U# C
<%
' w- b4 Z! g5 E: E. E
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";
' f4 R" R% q6 B% c7 s1 Q; a/ T- F
stmt=conn.createstatement();
- G g( ^0 Z# `. M
rs=stmt.executequery(sqlu);
$ e! d9 y6 f5 h/ s+ w
%>
) h. h' @- V9 J: s
<script language='javascript'>
: l* i/ n5 |; M
arr = new array();
! S& G8 a, y! h0 p R
<% int temp=0;
0 p! c/ ], `, | s3 C) I
while(rs.next())
- K3 [2 j( Y$ G
{
' K# Z# U) S- z# p' q; n" f
%>
7 U: `: R# |2 ? v# i& Q8 ?, L3 u
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
" S6 }2 F9 h+ ^% L
<%
2 p( D7 k- C7 H
temp = temp + 1;
; x+ H. q: d' i3 R
}
$ c; F" H9 y8 D, k( [; R
%>
" I) u' W# C: D& g6 p' E
temp=<%=temp%>;
3 p0 Z3 e: t- P x; [# j$ [ \4 x& Q
function changelocation(id){
8 g) a- o* p9 p% E
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
9 i- j+ H y( M% q4 G
var i = 0;
& k9 V( H" L7 v v, l F
document.combo_box.city.options[0]=new option('-------','');
* d4 Z4 ?0 _' n
for(i=0;i<temp;i++){
6 t" ^/ E2 O$ ?# q
if(arr
[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
) v# i9 [- h# P3 Y. D0 n+ r4 O2 a
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
! b G. o, {1 e& X" N8 A5 U
}
, S0 Y4 K/ E0 q" y* x
}
* S+ J* g( ]: I9 e6 @
}
) c4 N: `; n" x0 D# p
</script>
8 w. J% a) T" M! K/ b1 l
1 ]7 p$ h' H7 T8 M" E6 _
<form name="combo_box">
' x' U4 t: z# C6 e
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
' E, }- S& n& D7 X8 C
<tr height="24">
) i7 A8 b+ ^6 A- m! ]! S" I
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
, G) a+ s [# m( O1 |
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% E. e8 a0 e; i' D0 l+ m4 b
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
* j$ {- `+ d! g( F+ u$ s
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
% H) x3 L* l/ l [" o3 i
</tr>
0 `" O5 v5 \7 |" Z1 b c7 `" Q8 }3 B
<tr>
) K; X4 \9 J9 i1 |
<td>
$ W9 O O$ [9 V& e: {
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
" ^* @, F/ [2 I' j! @+ U/ M( F
<option value="0">请选择部门 ---></option>
, @& p/ o7 G, w% R9 S! P+ Z
<%
# O* a3 X+ P' [" |! ?% r0 v
string sqld="select * from tdept";
" }8 r6 f9 j w" R
stmt=conn.createstatement();
3 k% f: [3 [- Q# J. n9 y
rs=stmt.executequery(sqld);
; e0 W! G* L# ?- o* t; i
while(rs.next())
% M- U3 B; C+ @0 _
{
3 b- d) ^& X0 V/ U$ E" f7 W
%>
9 V: q1 V* _2 k. D4 F7 F
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
. [9 ~5 H2 T0 t ]( n D6 f
<%
+ J* r5 M: }6 d2 q- B( a
}
l; j. ?; g( q( l8 s1 w
%>
, \: }9 Y0 U; s1 r# i& F
</select>
& G. l S. ]% d) p6 I
</td>
9 f' [/ l8 N# q* ~$ {1 c. z
<td>
2 [' @9 [% j, H3 S. G- {% ] `
<select multiple id=city style="width:150;height:200" class="bgc">
! `/ z8 ]* v, j) f0 Z
</select>
) m! P7 ^" w. B, z) Q
</td>
8 o4 L( }3 I& x* w
<td nowrap align="center" class="bgc">
$ ?$ c/ ?- n& v, X* v z0 M
<input type="button" value="<<" class="buttons">
- d* [* G6 p3 n) M$ u1 u
<input type="button" value=">>" class="buttons">
% n0 t9 e( h- A" h8 E% Q: y
</td>
; s0 I- K. U& O3 O
<td>
) |5 q1 t& z8 }! b# K7 g
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
3 V7 k+ e, s6 I; H; @1 j q2 Z3 f
</select>
$ A- v( c% B0 @. T) L
</td>
, e0 o6 L. y% v; z& i* g+ z) s
</tr>
$ ?# g7 o3 H& S- r% a
<tr class="bgc">
2 [$ [3 U2 p/ M. ?, N r
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
) U9 i3 H2 {, `: L) g! _' k6 C" C
</tr>
- K& Z! s' G# ?) r' {* j3 I% @
</table>
1 Y! s' q, P' m% R! q1 z% A% l
</form>
# S4 x$ h6 Z6 C: T3 N
<script language="javascript">
1 n- C9 |/ V- K# t4 h
//人名移动
3 [4 c. w8 q) a) J. x8 \! q# z
function move(fbox, tbox) {
+ f1 y3 Y& i( y; H% p) q, F
var arrfbox = new array();
/ Z: S- _( N0 t& q. V0 T1 j2 L6 D. \
var arrtbox = new array();
^3 X, `. B6 T' s7 Q
var arrlookup = new array();
$ Z w/ K- q) J3 }! o! B2 }0 K
var i;
0 u C7 S* Q8 |* W" t. s+ y' X
for (i = 0; i < tbox.options.length; i++) {
9 H, m# @. H9 }) J4 {
arrlookup[tbox.options
.text] = tbox.options
.value;
% d ~) F! p& }0 M: O
arrtbox
= tbox.options
.text;
$ A4 n5 |9 R9 [- W2 {9 {) u, {
}
, Z* g8 s) h3 T# W& D | }# R
var flength = 0;
. v Q- @3 c4 \; [' ^' O
var tlength = arrtbox.length;
* Y+ I, E) a+ ~0 B
for(i = 0; i < fbox.options.length; i++) {
8 @, p# ]& H4 ^& Q: D
arrlookup[fbox.options
.text] = fbox.options
.value;
( U. q! g8 X. J3 D, N
if (fbox.options
.selected && fbox.options
.value != "") {
* _7 a9 G0 ^ x9 O, H
arrtbox[tlength] = fbox.options
.text;
0 c, q% K# r8 f0 |8 I
tlength++;
1 y/ [" Z* G& {" |. i
}
: C2 O, N: J+ a5 q i6 \0 y8 `. B
else {
2 \6 ?; k; Y5 g, W2 D2 M% k
arrfbox[flength] = fbox.options
.text;
: E/ c* ~- `9 X/ h, ~: W/ `( [3 F
flength++;
c% n( C' a! _
}
! o0 @, j/ t/ m+ y9 P8 G# F
}
8 |6 E8 |; q9 b+ d
arrfbox.sort();
* K: V9 B# u5 \/ H( g4 ~ s4 \' N9 W, F
arrtbox.sort();
. `* S" w2 H- g4 S! V
: l" @$ a. \2 t7 w* S$ t/ M5 G6 Z
fbox.length = 0;
& _9 v+ ?# s5 g* p* E# L
tbox.length = 0;
( n1 P# j j! z: i1 b$ m( ^$ G+ e
var c;
: o9 b0 W( O* t
for(c = 0; c < arrfbox.length; c++) {
1 j& O: t. S" L9 p
var no = new option();
! ]& s3 r; x2 u$ F
no.value = arrlookup[arrfbox[c]];
: S. t) X, \* ^' e$ j
no.text = arrfbox[c];
3 J" ? n1 z3 W9 L* v1 _
fbox[c] = no;
. t `" u- g' d* F: ~$ l
}
) s" A8 ~2 D7 t
for(c = 0; c < arrtbox.length; c++) {
5 D6 f) p% K& T1 v" l
var no = new option();
) x( n7 m5 _& h/ t
no.value = arrlookup[arrtbox[c]];
5 F0 n5 X0 |% C8 y" B5 Z
no.text = arrtbox[c];
& F; @( g1 X/ {7 u# c
tbox[c] = no;
' U; C2 W) `* V5 L( G7 `/ B9 I
}
) h' k) i/ P7 D* L8 d
}
: P; V0 E# B7 t6 m! ~- h* q
</script>
# C$ i$ ~: W7 m2 z
</body>
( g5 A# ?: W3 n" [6 `: j& Z
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2