标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
9 _# O2 p( ^' P; ~
c pageencoding="gb2312"
0 Y7 d9 X& z8 G- o: S- i: E7 I% V
%>
. h7 @% F% p# b9 @
<style>
! c: B& d z+ w* s$ u- J Y
.f9{ font-size:9pt; }
" D9 j& f9 A" i. T8 x/ n
.bgc{ background-color:#aecaf9; color: #0033ff }
' S) P' j: V# r
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
S5 h6 M1 d! y
border-bottom: solid 1px #4e7dc1;
& |1 Z* f' g9 H$ @
border-left: solid 1px #aecaf9;
0 _8 ]% l- [$ F& B' z+ `
border-right: solid 1px #5679bd;
) h7 s }) [4 Z0 q# o5 |" F
padding:1px;
7 w3 q1 O& u0 i3 {! p. @
margin:0px;}
8 }1 N4 i$ L) y) _0 {! ~
</style>
1 e( Z- j( {- N* w1 [
<script language="javascript">
+ V b2 w3 U I- U& l# U
<!--
" g/ r$ ~9 t1 E( W2 S1 [6 e7 m
function rv()
& @2 B) _' K2 p1 |) p: A/ j$ j
{
! g7 ]6 R/ ?7 l6 ?% I
var val="";
8 L' ^' F4 X( M; v: K
for(i=0;i<combo_box.list2.length;i++){
3 t* s# m( ^" G( B: T
val+=","+combo_box.list2
.value;
% f6 c) t2 t) {2 L
}
! ~$ Q Z8 q: O! ]! m
if(val.charat(0)==","){
- t' n+ f; ~ z0 Q. o
val=val.substr(1,val.length);
# S0 q* ]7 V# U; W
}
$ `- r& U& h$ j8 e4 x1 J/ N
opener.form1.frecname.value=val;
) l* E" Y# n2 e* \+ y8 q
self.close();
1 B6 E" r: u, d" X
}
9 s6 ], ^ i$ H9 Z
//-->
; x0 @0 E8 m6 C
</script>
8 d; h% N2 e3 W4 Q7 w* U2 z
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
! ]. _% J8 N; @ }+ K4 K5 O
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
4 K8 O# ^' \" w/ {$ V: g
<%
! w) ?8 Y# g5 l. p( b/ t8 k: ?
cdatasource ds=new cdatasource(); //数据联结bean实例
. \9 ]6 E! M( o* `
java.sql.connection conn=ds.getconnection();
( K3 k+ \, A) X) f- ~; i
java.sql.statement stmt=null;
) g, p. J7 q9 |4 ~' B- m
java.sql.resultset rs=null;
; K, _* u" i) C( f5 s0 c4 c' C6 j M
cdatacheck dc=new cdatacheck();
$ \( S2 n0 p( m3 A) B+ ` ]( g7 ]" M
%>
" r4 e' ]/ u* C3 ~
<%
5 e7 m! n% r7 `' t) 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";
) H: M! v- p1 T
stmt=conn.createstatement();
7 ?; Q8 i( R& Q9 z/ a
rs=stmt.executequery(sqlu);
! T) t& `9 p, ~( U) p8 c O( e
%>
" b7 J3 P7 M1 I; l O, B; `3 D
<script language='javascript'>
' M" h( u( u% v6 Y% _
arr = new array();
: u/ T: _8 i1 S8 w
<% int temp=0;
* n' Z+ g1 B# g3 S! ?" G, d& ^
while(rs.next())
, q+ Z* p$ G* c0 ]" S" U& H* J
{
- |! a, n( x, l
%>
1 L0 g- q8 B, M( N, `9 w" k ~
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
8 X0 L8 r8 W0 _9 \( x6 N. O) ^
<%
# q) _5 G& O) E6 m- M4 ?. V
temp = temp + 1;
: e2 w* H6 ]* T% ?
}
9 X$ O; f) `/ n
%>
9 a" B+ S# a3 D; I% i3 U
temp=<%=temp%>;
5 l' b, ^3 Z4 B; Z9 i8 P; i" j% ^. N
function changelocation(id){
. i& y9 P9 o" B! n
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
; F/ Y. Z+ T ^: b. e
var i = 0;
& o; X" g: W" n3 O6 z; y# M
document.combo_box.city.options[0]=new option('-------','');
6 r: u4 N4 {: [* F% Z
for(i=0;i<temp;i++){
L" c3 D* I1 u( ^ w e. c) `3 Z
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
; R) d2 D$ C3 | F6 D7 }
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
; K! f& {( h/ y7 P# P
}
# n9 E% ~9 Z9 ?# ]/ M( U! I# Y$ |
}
M6 `# \' x6 l a+ v
}
|2 \' }! ^. V! k- I, n! @
</script>
4 F2 T% b8 [( w- X0 g3 G
/ s. p: p; U+ I, E- T. G
<form name="combo_box">
! Q$ c+ O, z3 x- E
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
) [+ R( f4 \2 S- V: H4 K9 X5 `
<tr height="24">
, t2 a2 I, s/ K0 d) Y. r* M6 o- |5 l
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
" J+ w" Q5 B2 H3 d+ ]- ?
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
( Y1 a; z/ a: P* j
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
1 r" m( h v" W5 g' ]8 m! @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
7 m) k5 X$ c+ @" m9 \
</tr>
, U: u. O" }. B0 X" h
<tr>
2 j3 p" ^+ T& i( w m* s! }
<td>
8 }( k. ~! E1 X0 t8 W% k. r. g
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
! `5 n2 \) @3 H! b
<option value="0">请选择部门 ---></option>
1 f. T" m/ X& k) s5 Z4 e
<%
! o, E# E" b8 e
string sqld="select * from tdept";
( x/ P% X+ ~8 L7 l( q
stmt=conn.createstatement();
2 U. F3 N3 P$ O; l
rs=stmt.executequery(sqld);
- T$ N8 f( _7 e9 p; S2 h; X! s
while(rs.next())
1 H. H1 {; i. c; K3 |
{
5 v) I8 }& Q9 k% n7 |, j8 Y2 F
%>
+ Y3 `! M7 l& Q6 o' ^3 C3 z
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
2 @0 W3 h2 Z; W" y$ g- f
<%
* W, m* l4 N; r7 p! ~- E% M; B
}
6 O+ C. _0 N( a+ c
%>
* |& u* Y. V& Z$ _
</select>
3 T, q& @1 j' Q g0 U( t
</td>
9 L, c6 z s2 S+ r- p& {6 Z
<td>
* u5 ]; f4 c3 l$ b5 L) r
<select multiple id=city style="width:150;height:200" class="bgc">
. }5 z; ~: D& S7 ?+ ^4 B4 ~
</select>
6 `, g& M8 p$ u/ ]% d6 x! ~6 t1 V$ |
</td>
6 g- d5 [2 B) }8 V0 g6 z' s1 P
<td nowrap align="center" class="bgc">
# N6 g5 L1 ?+ @) `: ]
<input type="button" value="<<" class="buttons">
" Z" e, w, C3 U7 D
<input type="button" value=">>" class="buttons">
* Y7 q' @* x7 q5 I4 u* b
</td>
7 {+ c5 T G; ]! u% H
<td>
8 ]/ Q1 r* N1 J3 B4 p2 ?
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
3 X( f; y, W6 j9 ]% h1 P' P
</select>
, `' g V" v( C! X
</td>
# e. {( }2 j2 b' ^. J
</tr>
# } q: {1 x1 z+ A9 z1 |
<tr class="bgc">
, d3 a+ p) N U2 l7 q6 q
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
4 p) _; ^5 D* D
</tr>
7 w G) E) @# o6 p3 j5 G7 |2 O
</table>
3 t# V( q: Y6 X' v) F: U/ ^# L0 \' T
</form>
& B0 t/ x* `, y/ E
<script language="javascript">
" N9 @1 G" `5 O: Y+ p0 v6 m; v
//人名移动
( j* I& }# l5 t
function move(fbox, tbox) {
" t9 t/ ]0 x& \) R9 Z$ \5 s
var arrfbox = new array();
4 o, t: ?5 `4 c3 U D; V6 ^0 ]
var arrtbox = new array();
6 k! T: o& f* R# W& Q& i8 d
var arrlookup = new array();
" K# l, N* _. t6 _% w& f
var i;
' ~6 ~% @8 c8 ]+ a/ d q
for (i = 0; i < tbox.options.length; i++) {
' ^- a$ j4 B" U% @- W
arrlookup[tbox.options
.text] = tbox.options
.value;
7 ]! S6 P' u# p' V" @: w2 t3 D
arrtbox
= tbox.options
.text;
. i# B, ^7 X6 }* f$ G" N5 c
}
# K. ^8 C: M3 P) Z$ ?9 Y. g2 F
var flength = 0;
8 y- ~' o, P3 x% h
var tlength = arrtbox.length;
) h. j) B- l0 Q3 _+ X& V
for(i = 0; i < fbox.options.length; i++) {
: y0 |) R2 @( g5 q3 I
arrlookup[fbox.options
.text] = fbox.options
.value;
% X, B% _( r& ?7 G( K; C7 u
if (fbox.options
.selected && fbox.options
.value != "") {
3 \. j i1 g+ n5 @8 Z3 z& p9 T; i
arrtbox[tlength] = fbox.options
.text;
. V6 N: f4 ~( \4 F4 }( n; o
tlength++;
7 O1 R0 h4 M# q: X, n: q
}
+ J0 ~" f/ [ q
else {
, a: A. c, e; v% Z1 S
arrfbox[flength] = fbox.options
.text;
# l. w& M7 n# [; D* ~
flength++;
. A* [5 f2 X$ D+ q7 j: e1 e
}
: A' b4 A" |7 c. o) L! }
}
4 k: L1 G7 m5 R' Y& X6 E
arrfbox.sort();
! X a# ?6 C: [- G
arrtbox.sort();
2 q8 R/ {4 \9 ]4 X9 F3 N
. u$ S- _$ D( @& i) w- D3 n0 u. F& o
fbox.length = 0;
- O1 L3 [, a" I; P- J: R) s ~
tbox.length = 0;
+ y3 ~; I# }+ W1 Y7 ?( K' |: W
var c;
$ ~6 i! r) ]2 s
for(c = 0; c < arrfbox.length; c++) {
; G* L* r4 |& V t- D9 [
var no = new option();
! Q6 B# |& \2 C4 q1 Z N, l
no.value = arrlookup[arrfbox[c]];
{! X0 `% v8 ]& g3 U6 J
no.text = arrfbox[c];
/ U7 u! o5 U# b; n$ c6 J
fbox[c] = no;
! h% v6 f/ D Q& ~) ]
}
U* S4 j7 v3 i) B3 u) l
for(c = 0; c < arrtbox.length; c++) {
* Y( `( p" h0 H
var no = new option();
! ^& U8 c) v4 Y/ O; Y" ?% t: x
no.value = arrlookup[arrtbox[c]];
* ~1 g" h- p% m# Y. H. k
no.text = arrtbox[c];
+ Z( f+ R, o6 } ~3 {# p$ k
tbox[c] = no;
* C. P% b/ ]- c6 B$ x% A
}
" A G6 D/ R$ j. S3 g; i6 F
}
5 i2 j" Q( e0 B. B z# l% n
</script>
, P5 K! J4 S! {6 l `
</body>
& U( Z$ o) O' X9 p/ |3 P# h
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
