标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
- V, ?5 M$ Q3 J: A" ~
c pageencoding="gb2312"
* Q; o$ H0 F( _; \* S1 ~/ b
%>
8 m2 N, J' m D( ^6 J4 c
<style>
, c- n3 R( W, d7 c+ B% \+ a7 P
.f9{ font-size:9pt; }
. `- ?0 D/ q& g$ ^; H
.bgc{ background-color:#aecaf9; color: #0033ff }
* N* [# `; d: Q) j) ?$ k
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
8 K5 J9 W3 x" ^! N
border-bottom: solid 1px #4e7dc1;
& T* s( |, y3 M
border-left: solid 1px #aecaf9;
5 w& G4 P5 i$ X' T5 n) E
border-right: solid 1px #5679bd;
9 m5 h6 K1 w% l% F1 p) g8 f
padding:1px;
% U: \" r& t" X0 ^
margin:0px;}
. s; u+ d4 K# }2 `
</style>
; W1 z7 r8 P% H$ Z- T7 d
<script language="javascript">
) p' X4 m f( D+ y" D; f: D0 I( H
<!--
$ B- c, r! g1 o3 G
function rv()
: @5 b' c# g' N) \$ W
{
: o9 v \/ w) L6 X2 M6 @
var val="";
, D" |* _8 m1 S! A
for(i=0;i<combo_box.list2.length;i++){
/ i3 o* f9 s. W$ ^* W# W. I# j
val+=","+combo_box.list2
.value;
0 E" A ^/ T- M
}
# Y+ h. u( q* q. c
if(val.charat(0)==","){
& t$ |$ y% k( I3 [6 `# e
val=val.substr(1,val.length);
- g5 E6 Z( p1 R& ~5 [$ r
}
" Z p7 I1 O6 [' C
opener.form1.frecname.value=val;
, u3 Z8 Y5 k$ c: x6 ~' L4 K
self.close();
& G! F. u5 N( t |! O( L
}
% E9 `+ l! l% j- P! t. c( y
//-->
8 }5 R' `3 n, w+ l" [: M
</script>
' Q* q* b3 K. @: l! c
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
( S. w0 K7 o6 X* c: M' r, M
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
& D5 D# g% O# M N# X
<%
- F- k. I9 v, @6 z4 V4 {, p
cdatasource ds=new cdatasource(); //数据联结bean实例
1 y& j) J. T6 ]3 m. N; d7 _
java.sql.connection conn=ds.getconnection();
5 v5 B$ G0 k' g
java.sql.statement stmt=null;
- o* [' h3 t+ I" \5 M( H9 U) b
java.sql.resultset rs=null;
4 F1 _: X B- g/ L" ~: S4 e9 s. T
cdatacheck dc=new cdatacheck();
" [! I# T) p2 p& e7 ~0 R% ^
%>
7 g6 x2 F0 t! G0 a6 k
<%
$ f( m/ D+ K( n8 r
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";
# d+ S5 |0 }0 p
stmt=conn.createstatement();
! U$ w2 [$ A4 m0 z
rs=stmt.executequery(sqlu);
$ `2 F `8 {+ I- e6 ^
%>
3 P- G6 K" t- Z4 f H
<script language='javascript'>
, k& l' T' Y' k
arr = new array();
" P% [% X; W5 K4 ~8 f& c4 _
<% int temp=0;
6 J1 G$ c/ \( W6 K
while(rs.next())
9 p8 W9 x* w& q: j% ~) J
{
4 L% S0 {* E+ W4 U- s. d' H6 o6 s
%>
) q1 |' v0 M" e* p
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
6 r. S* ?# n! |5 ?
<%
9 F/ G. N0 E) { B
temp = temp + 1;
, R1 e3 _ x* {! O0 @; y1 Y5 q
}
9 d# h1 y: G/ q/ k! ]
%>
. k: x" ] H# _' ~6 J6 _+ `
temp=<%=temp%>;
9 g3 J W( s7 t6 J6 {: |2 y" |
function changelocation(id){
$ X) R" e7 Q6 n1 c5 I) U- k7 ^
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
+ v9 ]3 T5 b( z: M* J, B& G4 w
var i = 0;
8 n. p( T2 V4 I& p* s
document.combo_box.city.options[0]=new option('-------','');
3 v0 @" H' C @" D
for(i=0;i<temp;i++){
& l( D/ ?5 u7 Y2 L+ c$ O4 k! _1 G, _
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
Z& A4 ?! b0 x' U8 I2 Z0 K) w& G
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
. a8 X L7 @1 H) I+ w, t
}
( D% @& f, L P) y4 C- @
}
( ?& `8 Y" g8 i x7 M
}
( Z& n0 F7 h2 x! X
</script>
& |0 }$ g4 d) C( l" @& y) w2 g8 q& i
# O3 E+ l) @4 K2 E M
<form name="combo_box">
4 h6 D, {& ? n( p4 k- \# o( L# D
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
/ H8 _$ A. e* a5 {: E
<tr height="24">
. o0 g: P1 x: \) u
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
$ _2 X8 l U/ A' b7 D
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ h5 b$ L) G* Y$ J2 Q9 `
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
# ]; M( Q) Z! D5 C
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
- }) M, I% G& }4 q+ l+ p# N
</tr>
; G' u& I3 Q6 E
<tr>
8 B% T! a8 C# }: s
<td>
4 d- l$ ^% ?& M7 X/ o* \5 G
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
3 m; J4 A: {8 i7 B
<option value="0">请选择部门 ---></option>
+ p/ L! v) @$ p$ ~3 L' b0 B
<%
/ x; h: T. [ _/ D" n2 T/ k/ ~( a' m
string sqld="select * from tdept";
0 }% ^6 Q3 r" e" F
stmt=conn.createstatement();
+ z) f5 |) \1 G/ H5 h
rs=stmt.executequery(sqld);
% b1 i% q( \' j" C
while(rs.next())
. D. A4 }. g8 |7 a/ f( q/ v" R
{
& R7 M0 m* Z( l* D! S" }5 M
%>
- P k) N- A3 g M
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
9 w. E1 Z0 h) v0 X D. m
<%
T M% g' M, T7 s( h8 B
}
+ p2 v+ { |( J5 ~9 p7 x$ U
%>
7 @1 e) Q5 q4 D+ B. N: J# a) J# e. }- W
</select>
5 u/ p! {6 _0 p
</td>
; t. X/ |2 R3 w/ ]" k
<td>
" N: G7 ~" E1 [' k: B7 E! B
<select multiple id=city style="width:150;height:200" class="bgc">
, ~( L& \4 i% X! b
</select>
9 r& _7 }* k4 Z/ T8 U3 J9 R3 [
</td>
5 m% E" z! \% s9 X$ D
<td nowrap align="center" class="bgc">
; f: |# l0 j/ s) I6 C
<input type="button" value="<<" class="buttons">
; U/ D) s% w- ~( T; q, \! ~; l2 l
<input type="button" value=">>" class="buttons">
: b& g) ]$ t0 G+ z% [% \8 `
</td>
/ X* {; U5 k, H- E8 I
<td>
( F) c, R! F! e
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
" o% F: k- V& l4 O3 @
</select>
9 G3 \+ L& Q" ]2 y1 ^" r5 Y ^
</td>
# s1 m" N$ F: `1 u- y: R3 D, C+ q. K
</tr>
& F) c2 o+ p9 k0 c
<tr class="bgc">
6 v$ M* k/ D( E1 D' w/ m1 |
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
) N# b" q$ O1 g; C& }
</tr>
& N6 h6 X1 u: ?( }
</table>
# C- }# p+ b0 `; s
</form>
5 h7 ^! u/ U5 q: D
<script language="javascript">
1 Q! ~& d; B! g$ e# R; W6 |
//人名移动
- p( s: p! @- G a3 y5 e2 C) [
function move(fbox, tbox) {
* Y4 U, y( ~; m
var arrfbox = new array();
3 w; F$ D$ P3 U2 V7 R4 T2 L
var arrtbox = new array();
; e+ ~; i* T$ B6 n/ u j
var arrlookup = new array();
6 n3 E/ x2 a8 s: I* U- d. F! h: t
var i;
9 I2 i d1 Y' Z) h
for (i = 0; i < tbox.options.length; i++) {
1 @: R9 j; U* J, J1 n' }
arrlookup[tbox.options
.text] = tbox.options
.value;
) j) e" c/ }& D0 \8 _
arrtbox
= tbox.options
.text;
. q4 C' f) ]/ d7 e/ M; } d2 }
}
+ T7 l( w+ c/ W C7 {
var flength = 0;
" y: C( S# M+ q( M- d( Z. J
var tlength = arrtbox.length;
. j; e* ~" \0 q7 |" S
for(i = 0; i < fbox.options.length; i++) {
1 ]8 S5 T, d; @
arrlookup[fbox.options
.text] = fbox.options
.value;
, F0 q7 ~( F! J2 `
if (fbox.options
.selected && fbox.options
.value != "") {
, f6 e+ a W* k! l+ E9 `3 @
arrtbox[tlength] = fbox.options
.text;
$ u( m, g& W9 g* z; k" V( M
tlength++;
9 t& h8 _2 Z2 E( h' B: n
}
6 f' a* X0 E( ]1 L; q
else {
O. Z- J% _) _; ~
arrfbox[flength] = fbox.options
.text;
. X, h( e4 j7 w. F: ]4 G5 G+ }
flength++;
! s; w( z( E" P3 k. U3 R
}
6 f/ l5 B5 N, ^* k: X* B
}
5 m" n8 F! P! t/ Y7 o% ~# `
arrfbox.sort();
' m$ s* Q2 T$ f. I. C/ O4 W3 q
arrtbox.sort();
' d$ a+ z5 \" A/ }! ^
8 o+ M0 J4 R3 E' a+ |& I
fbox.length = 0;
7 U/ y9 ?1 U8 ^2 L1 N
tbox.length = 0;
9 w* q. E8 f( [2 O1 K: e! l/ |( h
var c;
/ P& d! B* p9 m. m4 D! G+ \" ~1 i
for(c = 0; c < arrfbox.length; c++) {
( N c* L4 `7 a5 ?/ a# R& N
var no = new option();
" H; S6 i" \& \. u) D8 H
no.value = arrlookup[arrfbox[c]];
6 B' m( m4 b) Z! c' r
no.text = arrfbox[c];
5 d/ j$ q, _0 A Q5 ]8 p; W
fbox[c] = no;
% q D* U# O+ ^" F* E* J* U
}
: n5 X' ~& L+ q" s
for(c = 0; c < arrtbox.length; c++) {
4 y2 L3 g8 E/ f+ ^
var no = new option();
1 D6 Z( v, z3 }: v% Y# b# D
no.value = arrlookup[arrtbox[c]];
+ T- ]- J9 E9 F t. o
no.text = arrtbox[c];
) A4 P0 k" }& n
tbox[c] = no;
0 F, H2 L4 J+ t, E; E
}
( n! ]1 n2 f3 R& v9 W' T' U8 U
}
8 M! I9 i) [# d8 J
</script>
& x6 r: T! w( O0 n+ @
</body>
, M. i- E9 h. k8 ]9 X' L
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
