标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
* M* d! }0 h- v! m
c pageencoding="gb2312"
% U! n8 z5 w8 {. Y! P& F
%>
1 C9 s) X8 j$ x
<style>
% H6 y5 h& g8 d( F' N
.f9{ font-size:9pt; }
! J$ N+ o: {, h7 z" D9 U* d: d8 V) N3 T
.bgc{ background-color:#aecaf9; color: #0033ff }
/ \5 {3 }% k. U5 V
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
- }" o" c" ^; e3 M( p3 |* B( c
border-bottom: solid 1px #4e7dc1;
7 t! Y% C5 n5 b8 W: O( l
border-left: solid 1px #aecaf9;
% |/ l! c' \ F% T% `4 {
border-right: solid 1px #5679bd;
" O2 h0 \ k$ T7 H; o# L$ M. W; O
padding:1px;
* Q/ L- O" {! d: H4 f
margin:0px;}
' ]1 ~+ p5 b, c8 R
</style>
- d, ]3 G m4 U$ ]- R- t
<script language="javascript">
+ g1 |! @1 w' t2 A9 d0 }) E. c
<!--
M+ F' G6 t* i/ A4 A# z
function rv()
$ t4 N3 h* h0 O- X6 J/ A" U, Z0 w
{
' c+ h. @( P/ Q U5 x" d' m j$ z
var val="";
) J7 t! t6 N( ]; `, f( ?' d
for(i=0;i<combo_box.list2.length;i++){
' y- j* z% o4 M+ e$ `
val+=","+combo_box.list2
.value;
8 [$ r6 ^; B/ u% R
}
5 p5 p7 z& l/ ]2 J
if(val.charat(0)==","){
" [) ? O1 q& }' Y8 v; t8 l
val=val.substr(1,val.length);
2 L) R3 E- h, K- B/ a) U
}
3 R% S6 S5 e- |) P1 [# R
opener.form1.frecname.value=val;
l# N5 |+ ?$ e' y+ E
self.close();
# c3 u. }2 o. n
}
" j( N& ^1 ^3 N/ C' X2 K0 Y& E
//-->
0 d* B, o3 b9 L! r+ r
</script>
3 J( o% V7 V+ H' B
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
' ~. ]+ C" D7 n! K8 v
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
* M9 U- L1 _: E, n
<%
t0 T/ U: [5 B7 N) ?2 F) v
cdatasource ds=new cdatasource(); //数据联结bean实例
! B6 E7 M3 X1 N- V0 T: K9 K1 ~! Y6 N
java.sql.connection conn=ds.getconnection();
: U% z, n0 v* s4 D5 Z
java.sql.statement stmt=null;
9 ~* L* |" m8 F9 P
java.sql.resultset rs=null;
9 T6 \8 H* K a% a- F3 Q
cdatacheck dc=new cdatacheck();
& z2 \3 p. U: ^" C! ]8 z" w! O8 h
%>
- h9 K7 V8 |) d/ a' A
<%
" Q# u! o; O# h3 {3 {
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";
, H5 \) O, L% o2 O* J% |5 P3 q
stmt=conn.createstatement();
- D% y/ m" x% e; D4 g0 d3 x
rs=stmt.executequery(sqlu);
( J0 K( `% M: J4 m1 \4 t% W) A
%>
8 _8 ]5 E4 o. S, x0 Y5 P
<script language='javascript'>
6 }/ H* Z* `2 p2 w/ Y- l3 O
arr = new array();
% q6 w" Q# N9 Q8 Y0 U6 `# \
<% int temp=0;
" l; D5 ~1 _! O# C* Y
while(rs.next())
% B3 L3 g0 C$ Z+ z4 E! c$ x1 [: m
{
( J" q3 r ?6 u i8 I- S
%>
8 k+ D. `" X8 {5 }
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
) }- k2 V) ~; ]: f5 w, N
<%
5 W; J3 x2 ]- m8 |: |/ q) r8 _
temp = temp + 1;
4 |# W% L+ s8 V5 {
}
" w/ b6 K- `8 |. }* u* k2 Y! j
%>
& y2 o' w2 I5 [* U' V* A
temp=<%=temp%>;
+ |: e1 {1 V1 i$ I* O( Y
function changelocation(id){
# o- E& f; g }/ E* W" N$ y- Y
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
/ v" B& `3 y6 F
var i = 0;
/ S8 C6 v9 f5 I+ Y! b* O
document.combo_box.city.options[0]=new option('-------','');
( g8 }! Z5 m2 d2 P: `" ~
for(i=0;i<temp;i++){
+ @, |, g" ?# x' S
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
. U( }# {' P1 Y# A
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
3 p! G& h0 |0 O7 @: a3 j) |+ s
}
1 Z" u) a" |, ^
}
5 R1 x, M) W! @* \$ j! [
}
1 M! v; N' N' @& v2 T" ~ M/ r
</script>
- F+ }* ^# n2 g2 L
$ ?% y3 |( I% ?1 C. i5 I2 N5 O
<form name="combo_box">
. y$ w1 X) Q0 K# g$ @9 {: o6 P3 E' _
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
3 W, j q5 X2 c* x3 g: j# `
<tr height="24">
1 a7 ~/ F, g% E# x5 W
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
, ~. I! T% B, k
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ [% D5 c( D5 w2 r% J
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
9 I5 w2 P! G) a$ I& q; V1 N+ S( o
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
0 [3 }$ c( R8 ^
</tr>
9 v$ |. b+ R3 x+ \
<tr>
3 h: ?9 d" m6 ~; p0 Q2 W
<td>
/ i v. H8 ], Y9 G$ { D
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
5 h/ m) e9 l4 u/ K4 D
<option value="0">请选择部门 ---></option>
+ K, u; l2 D) x4 I# \$ M
<%
4 S( j5 M1 N/ H& w5 L0 Z- k
string sqld="select * from tdept";
6 F( c7 S& m: p' g
stmt=conn.createstatement();
6 ] O/ y! t( i2 {
rs=stmt.executequery(sqld);
! [* e7 O9 C3 M
while(rs.next())
/ G5 \* n) u0 h5 i
{
; l0 q, _7 K* Z5 y: y: m: r
%>
D, H9 i4 R- R: v6 V$ O2 Q4 T
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
- n( w; x; t3 F Z9 Q: @- B
<%
7 D0 [+ a" h& p! m; y) u9 Z! a: |
}
5 z9 _ j$ Z* \5 v
%>
- P; Q( L& A3 Q! @4 [' p/ ~
</select>
8 d2 D% Q- c# `: I9 x: g- a: [
</td>
( E% d k9 U; X
<td>
8 T% p! ]+ `, u& V" J- h
<select multiple id=city style="width:150;height:200" class="bgc">
- p4 A% @5 h, W7 S7 j' C; F0 o8 U
</select>
+ J1 z, n3 K' V7 d; @! J
</td>
( U3 Q% y4 N: h# ?$ ]) e
<td nowrap align="center" class="bgc">
7 R& p2 Z' O! k+ [7 l, [
<input type="button" value="<<" class="buttons">
5 V! ?; Q1 @' }
<input type="button" value=">>" class="buttons">
: [; O- J$ ]3 J" X
</td>
8 w1 B& f6 W; ^
<td>
& G6 M4 m3 E! r" O' X
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
/ J# H# F P. \5 K
</select>
: g! B9 ]; R# i
</td>
$ \6 W4 v) g( y2 B8 b
</tr>
" k. h5 o N4 R; s. f
<tr class="bgc">
) p+ |. b5 S* {# b1 q
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
7 L8 n" N" g# P6 `3 Q
</tr>
) a J2 `0 L0 t! \, Q9 F; U
</table>
$ l) q; A# l( i0 Q$ x1 M0 q1 Q
</form>
% d7 ~! {, Q/ Q) \/ d
<script language="javascript">
6 L; H% f# A3 [* o8 ?; t. u
//人名移动
3 R! y/ K" `) J$ T; T+ X
function move(fbox, tbox) {
! e" V% ~ C- Y, i3 A' \
var arrfbox = new array();
$ _: g4 n/ Q2 v# d
var arrtbox = new array();
0 o0 Y9 _& L* a$ x: Z7 K1 ^
var arrlookup = new array();
/ i" D0 `- Y/ v3 v e! ]+ B0 `
var i;
7 j: z7 V3 M- j; O$ E) s: a$ j
for (i = 0; i < tbox.options.length; i++) {
5 q( b& t: u% i7 b: K! p
arrlookup[tbox.options
.text] = tbox.options
.value;
5 K( Z8 c7 f/ i% g4 g$ [: C9 g4 X
arrtbox
= tbox.options
.text;
, s E9 v1 _/ x% g
}
5 q% H# ~5 e/ r
var flength = 0;
: y3 l" j. E9 e( n3 ~* _% U
var tlength = arrtbox.length;
9 f' _+ G9 D- f! C3 I! Z) F$ l* r- E! }
for(i = 0; i < fbox.options.length; i++) {
# A6 D: ~$ l- G* p
arrlookup[fbox.options
.text] = fbox.options
.value;
: c4 d) Q% W8 L+ A8 j2 ]
if (fbox.options
.selected && fbox.options
.value != "") {
) |& k8 E9 M- B0 Z# M
arrtbox[tlength] = fbox.options
.text;
9 B, |" C4 c8 y1 F$ B9 f
tlength++;
0 h- f+ X( F, x$ y) T: B$ H
}
" W. ^2 _9 _4 \9 O* l( @% x4 W
else {
( E9 b/ _2 J( U4 w: l9 y3 u
arrfbox[flength] = fbox.options
.text;
& z% M$ u) g3 c6 y
flength++;
, L2 ?+ H+ t" f8 c4 J B( |
}
" z+ }$ f, h: M" d1 l4 q6 h: k7 T# o
}
- j+ d% k9 u1 E* q8 b Q* ~1 o
arrfbox.sort();
1 d( U. A$ S) w+ G3 W7 n& ?. x
arrtbox.sort();
6 b( x! s" ?* F5 v- q+ F# n
( D6 Z2 t; i: }' |; X# L. N, I
fbox.length = 0;
6 Q% b& D. G4 R& O7 f1 H6 f; G
tbox.length = 0;
1 O. O( D0 f% Q/ p
var c;
1 @9 g2 ] _! D+ `% P2 ^' I2 p
for(c = 0; c < arrfbox.length; c++) {
! E! t( {1 W. q5 J
var no = new option();
3 b( o: {: f; i c& J
no.value = arrlookup[arrfbox[c]];
: {$ K. v) ~- h+ \& a! g
no.text = arrfbox[c];
! N% f1 P, g! Y0 Z: k- D5 D
fbox[c] = no;
' j/ n/ h2 g- `" l" m# `* H
}
# ], r& l. k z6 w4 g, ?
for(c = 0; c < arrtbox.length; c++) {
, x" j, d- x* p( L' D9 |& a# G4 O
var no = new option();
) [ J5 O5 f# j6 x* C
no.value = arrlookup[arrtbox[c]];
! O% h& F7 r0 ?1 q1 L
no.text = arrtbox[c];
4 G! Q8 y* v* z+ n) e: Q% h
tbox[c] = no;
( ^& l1 K; T. N! [7 ^& {- p! ]/ q
}
# d6 {* t/ A' Z6 q* |5 ~& [. q) W
}
+ G$ w/ x3 l9 m4 H5 K, s& Y
</script>
! `+ n8 s" w- P$ ~: L
</body>
1 N5 d |6 ?! O7 H7 o
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
