标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
0 {- ^- @4 [ E% }, s: j
c pageencoding="gb2312"
' @( ~7 P, b; Y- h+ l
%>
6 @* O. t. @& [$ @' b
<style>
- X8 U; [; M; p. |, }7 M+ ]; c/ B
.f9{ font-size:9pt; }
% q9 B) ?2 Z1 b Z" p+ e5 a
.bgc{ background-color:#aecaf9; color: #0033ff }
7 @) V8 I% D& `/ v3 P9 g( k- B
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
7 N$ {- V% I1 m2 |5 ~- I
border-bottom: solid 1px #4e7dc1;
5 `/ ?/ e$ F' ]2 O
border-left: solid 1px #aecaf9;
; Z3 y; \/ ?" B4 g2 Z" O$ o
border-right: solid 1px #5679bd;
; W: F) H, t5 c& `. }
padding:1px;
9 j3 S- l2 \8 f; i- J$ [: B
margin:0px;}
( ^6 K0 L5 d2 m
</style>
8 ^3 Q- R' w- k, F+ |1 d
<script language="javascript">
9 u0 |6 E; l3 G! Y
<!--
: E3 g: `' N! C1 |, }3 j9 e
function rv()
& S- {7 Y, `2 {$ l }* ~, P6 b. @8 ^$ `
{
% b2 q+ h7 S8 {; M+ ~
var val="";
$ v/ o2 r: l2 m' f. R
for(i=0;i<combo_box.list2.length;i++){
) Q6 N$ `) {3 x4 f( _7 `8 I
val+=","+combo_box.list2
.value;
1 r9 [, |. S. E( h( f6 j. N L
}
% ]/ h3 j6 y+ |4 d( e
if(val.charat(0)==","){
- q6 a: o7 P5 [4 v! m
val=val.substr(1,val.length);
* w8 W' q$ z/ M5 y: n2 ` T
}
3 K! a% s2 ^/ E6 j- M
opener.form1.frecname.value=val;
4 ^# l$ Z1 T) ]8 ?
self.close();
: w2 T- o4 j# v( K
}
5 t! R8 T4 s' t0 u7 ]) N
//-->
& ~2 J7 l9 j3 Z0 m* N; G
</script>
( ^& O; `0 `- x) s& H2 i5 b$ H- R
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
/ w! l0 W6 }3 e& w7 t% M
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
8 X+ Y" w9 v1 V1 g
<%
! D- o0 }! x0 h$ A. x
cdatasource ds=new cdatasource(); //数据联结bean实例
0 T9 H9 p$ S3 {3 F2 _+ L
java.sql.connection conn=ds.getconnection();
: o. k/ a7 T7 d6 R7 P9 d) Z
java.sql.statement stmt=null;
! e# `! R$ g5 d( I% K
java.sql.resultset rs=null;
' Z+ q; a/ w6 H0 L7 j$ X/ Z
cdatacheck dc=new cdatacheck();
. O, m$ o3 \! b
%>
% @" h# p7 _ G& G; c1 F
<%
- N. E' E% N3 P4 [' Y
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";
1 c9 w4 R0 L3 [# k
stmt=conn.createstatement();
! N; ?* b! E5 j: V! x7 A' X8 M; A2 Y
rs=stmt.executequery(sqlu);
; z0 g! m0 U: s: f( ^+ ?2 o
%>
$ ?- k8 w" P4 f$ I
<script language='javascript'>
$ y+ h; @- w* p0 @' E
arr = new array();
1 g. g+ P% }# k
<% int temp=0;
9 F- M1 s7 {! z) X7 I
while(rs.next())
9 b9 J9 r7 B: N& P+ V+ k* a; ?
{
8 x2 C9 }" ^9 c8 t: }
%>
; S3 E' v. i# r% Z" L3 ~
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
. K" _9 h3 `0 U# ?; D1 }* D
<%
O" ]8 f: s$ A( F9 p
temp = temp + 1;
# d' k- l+ b1 w
}
% T% b9 \+ \* S1 [
%>
% c) [- A1 {3 \; T
temp=<%=temp%>;
7 l/ c# g+ A% v* O h0 M5 j
function changelocation(id){
l$ a ~, p/ A' y* z: C5 @
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
' n8 `% \: S' e3 t" }) s
var i = 0;
) z/ ~9 n. U/ U6 @! R) w6 u. ^ ? K
document.combo_box.city.options[0]=new option('-------','');
* P2 _% W) ^1 t# z6 a8 i8 D$ G
for(i=0;i<temp;i++){
; \( y+ F: L. |: A$ Z+ W8 P
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
/ y, b9 b0 h5 ?) ~7 l& Q7 D" H
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
+ C' e7 G" O8 s; U
}
1 o) F" {7 @/ A, `1 y" j: B: i
}
1 A4 r' k4 F" k) ]+ B1 a& d$ E
}
& u: Y- v% H! z7 c
</script>
5 }0 M( ` n8 x
* j% d" E3 E$ O' J; i
<form name="combo_box">
( s" o+ V* Q* [# N
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
" b3 W$ {0 _8 N0 C- K. H0 J
<tr height="24">
+ w8 Z- X) c5 C( p7 e' H, ^9 S
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
: D d% z. Q) B* w" c$ B0 I R. | p
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
; p7 C/ |9 Y; d& g# ~3 M
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
+ p: `- f5 d9 f. x. i1 a
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
2 i" F, E. _) h" R( ?
</tr>
/ }, f) ~' d0 d; B* [: o
<tr>
# x* Q5 e1 L7 t0 F
<td>
# n( Y4 `6 E, d1 d# @
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
( }$ q, I7 a+ s4 ]) f" }
<option value="0">请选择部门 ---></option>
$ b; ~( m, E1 s1 m- A
<%
0 a# t; O; V! ]7 A2 {0 K
string sqld="select * from tdept";
5 t/ y- s6 X$ w8 D }' U) @& j
stmt=conn.createstatement();
7 w( R" E% U0 c( @- k& C
rs=stmt.executequery(sqld);
0 l4 ^6 X- J T
while(rs.next())
- L/ N0 J% s ~$ h# b
{
" Z! L/ v1 a* \$ u1 U% \0 a$ q
%>
) ?" Q @4 n) S B) w0 Q# }* ?
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
! S+ h. @) m( d
<%
7 U5 |, V, l6 R" ~" n/ U
}
- u3 y" A9 ^ h8 a) C& z9 K
%>
* |7 Y3 ]& T+ Y5 }/ W8 M
</select>
1 Z; I4 N( ^" Z3 h1 u6 ]2 \+ U
</td>
G8 ?) d* w/ X6 M+ b
<td>
# B9 y2 L! b o; m
<select multiple id=city style="width:150;height:200" class="bgc">
9 [# I) J4 B/ e5 u8 M- }, F4 R
</select>
8 P) x" K+ V7 l7 C' v' x
</td>
. p" w; e& t) J) d/ Y/ w
<td nowrap align="center" class="bgc">
7 e9 \% E! K! e0 q' C/ l/ k F
<input type="button" value="<<" class="buttons">
9 V+ l; }- @, h }+ H
<input type="button" value=">>" class="buttons">
c5 s( c$ R+ G
</td>
- M/ m0 g( p: u
<td>
6 Q% |. q+ f; D* B [. N0 |
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
3 b8 ?: o& m) W
</select>
2 i$ v7 S7 ^$ F" }/ p" j
</td>
4 y, [- }8 S. x0 V: k$ I/ c8 e2 y
</tr>
9 m7 J1 c3 n7 n9 b* X
<tr class="bgc">
) B2 g( Y* r3 Z$ i' R9 Z" C u7 ^, K
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
) s. s0 l5 I3 b& E- w8 w
</tr>
4 Z L2 J& W5 B) y
</table>
& e: [5 i: g Z2 ]* m% U4 j8 r
</form>
% e6 L! f9 G- b, M6 @- e/ H$ K
<script language="javascript">
4 s8 x1 c7 L8 z, W8 r2 D$ }
//人名移动
& ?8 C1 w8 v9 a" ?
function move(fbox, tbox) {
% C4 p/ ]8 b6 O( h. p
var arrfbox = new array();
# W1 G9 T) f$ u5 ~) }
var arrtbox = new array();
4 }% i# S+ H( n% S
var arrlookup = new array();
7 d+ y, K9 u! U, e' [4 e8 Y
var i;
4 H1 l i0 P& b( z) I
for (i = 0; i < tbox.options.length; i++) {
L- M/ h6 G: w+ a; C/ @! x7 y
arrlookup[tbox.options
.text] = tbox.options
.value;
1 S& v! c! V# d$ G- ]
arrtbox
= tbox.options
.text;
u1 E" H: W9 q+ P; B1 X9 z- ?
}
( ]3 V( L* C& j3 R) E3 \% B* }/ M) o
var flength = 0;
$ ^* U4 m i( y2 V% g9 r
var tlength = arrtbox.length;
* x- l, ]3 \ X% Y6 m" Z( c8 U6 H; N
for(i = 0; i < fbox.options.length; i++) {
5 Y2 o2 [0 F5 f" O" N. h6 g( `
arrlookup[fbox.options
.text] = fbox.options
.value;
) q* Z w1 l1 }$ \; Q1 ]( _8 w
if (fbox.options
.selected && fbox.options
.value != "") {
# ^5 n6 I$ w1 S6 p4 I
arrtbox[tlength] = fbox.options
.text;
# |, E" K s! p% x6 j# Z1 a5 k% B0 l
tlength++;
6 f; H$ {& J5 A8 P! Q+ Y3 S
}
7 `* V( ?1 ?8 f6 ?
else {
3 o% s7 T+ w8 V5 X9 ^7 b/ z/ Q
arrfbox[flength] = fbox.options
.text;
# A7 @1 _4 w" S
flength++;
9 R$ C: @- ?9 `1 I
}
5 C5 t. F- I2 V+ l+ a
}
6 L* D# J4 W3 Y6 I- i
arrfbox.sort();
+ @6 ~* c& ]) `4 x9 R# f8 D) p
arrtbox.sort();
m' R. k7 W' x7 ^4 j7 M
9 m& D6 D7 a7 N m$ X( ^" n L
fbox.length = 0;
, d: Y7 l' f" Z6 B, O5 B
tbox.length = 0;
! j3 r2 n8 L) p( B$ A e
var c;
, x! A2 j$ K }! }, Q, H
for(c = 0; c < arrfbox.length; c++) {
* W, }; O O9 C
var no = new option();
- G a4 S( e* K- \
no.value = arrlookup[arrfbox[c]];
4 f( e6 a o" F) N4 W9 g3 S; ~
no.text = arrfbox[c];
% q7 P- b& W* f" }
fbox[c] = no;
$ T- {! H$ y* x. ]( W, D& Y
}
5 [; l* K- y) m# K3 x
for(c = 0; c < arrtbox.length; c++) {
7 Z" ^' R) y% y% n' A
var no = new option();
. y+ h: X% y3 B& S- C- `* h
no.value = arrlookup[arrtbox[c]];
8 }! N% z+ K1 a1 ?
no.text = arrtbox[c];
7 W! J0 e4 {! l0 ^
tbox[c] = no;
+ a" ?; g% r# L$ I0 @" l9 ~8 M$ B
}
" ^. ^" U/ s! L- T# L2 J7 B
}
" b) j6 z9 H8 O8 m% C
</script>
& }& |1 V. v# C' b0 T; u, h' T
</body>
$ V* f; U. g. n
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
