标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
$ Z8 |/ x0 ]" i+ b7 a m. [
c pageencoding="gb2312"
9 h/ X( q' h' v% q/ H
%>
7 I8 o+ F0 X @& ]8 u9 @
<style>
! J {3 u. u/ v4 e! K) r/ t' M
.f9{ font-size:9pt; }
8 E+ i9 o; E* R" e/ f M
.bgc{ background-color:#aecaf9; color: #0033ff }
8 \7 x1 z9 O3 y- }
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
0 E) p4 c1 ]7 n( x: \' ]
border-bottom: solid 1px #4e7dc1;
' Q- h- s" R H+ D
border-left: solid 1px #aecaf9;
" s) L2 ?7 [! T5 K
border-right: solid 1px #5679bd;
! \9 h+ {$ K6 }( S; p' b& P1 J
padding:1px;
3 ?9 y8 h2 o) Q' U) s& _
margin:0px;}
2 R2 g( r$ X. G' _; s
</style>
$ d) l$ m h6 d" M2 Z
<script language="javascript">
# M2 B7 c4 }& Z- O: O% }6 \
<!--
6 X2 g& ?2 x$ }( v% t: p( I
function rv()
( n2 N; i( q0 n+ @
{
+ x; u, I7 ^ p' @# N6 V
var val="";
6 j H# h* \. x$ c6 [& o \
for(i=0;i<combo_box.list2.length;i++){
) b, D4 [9 F0 h( I
val+=","+combo_box.list2
.value;
% s: N8 O" h' @( e. ]
}
. \/ |7 C. T4 `) k
if(val.charat(0)==","){
, q* P+ `5 A+ d' a r) M' z
val=val.substr(1,val.length);
8 r- R) K- u- G% U9 [
}
1 d' \ l) t8 \! l$ P
opener.form1.frecname.value=val;
7 h$ x! I ]( n/ i8 {/ W: S0 o8 ~
self.close();
3 ~, q# N) o" n2 _0 ~; ]6 c9 Z; k
}
; V& Z5 I C) g) H) v; J
//-->
) z) ^ g) U7 u
</script>
; @2 b( C6 t. o& K2 k: ]
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
* S- W/ d* M) Z1 U9 |% A3 H o
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! j( A% T+ p! s) Z" W9 s5 [, V' F& O
<%
) n) f8 Y8 ~$ v4 J: ]
cdatasource ds=new cdatasource(); //数据联结bean实例
( R0 d- S2 n3 [1 @, z$ F
java.sql.connection conn=ds.getconnection();
- {9 c8 W' p( ~
java.sql.statement stmt=null;
! _+ \4 u: J- {; x
java.sql.resultset rs=null;
3 a1 I: e( x! \+ V$ [
cdatacheck dc=new cdatacheck();
7 v6 X [5 K+ v2 d
%>
1 Y; b7 P5 U5 T) u2 z% @6 D4 @
<%
. t3 l5 ~9 Z& I1 Z/ [ z9 D
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";
3 h& F6 t, j! \2 b
stmt=conn.createstatement();
- J% r, R/ O9 m0 G6 `
rs=stmt.executequery(sqlu);
* N2 }, \& z6 h4 p7 ?+ d
%>
6 Y+ f. k9 A# m0 n5 B
<script language='javascript'>
4 i8 o, l7 X- |! u+ A1 O7 {: j
arr = new array();
- p& K h4 K1 a8 d( P2 j* n- V
<% int temp=0;
% o; n7 ^; k' Y5 I
while(rs.next())
$ G$ K4 S$ q3 I9 R0 h- O' `% n6 Z" n
{
9 T( M' V4 o$ T" Q. j& @5 e$ c. E
%>
5 p) S/ h# P' J
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
# m& y: l( \7 i; u
<%
/ l" Z8 _$ ]9 x3 T9 c% W8 A
temp = temp + 1;
5 g4 H q2 ~# S0 G% T! x- K& \
}
, |- v4 R* ^# J e9 y2 T
%>
7 K* x8 z6 L4 t
temp=<%=temp%>;
) e! V- @* W2 D4 L
function changelocation(id){
8 b) r& a: l% Q$ c1 o- z
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
) R2 `1 A" l `6 y3 U0 @
var i = 0;
3 R/ Z# d' N3 L8 I P1 z
document.combo_box.city.options[0]=new option('-------','');
" { a' j: D M7 N' M/ L
for(i=0;i<temp;i++){
; k9 ?) A. A- {- C
if(arr
[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
h- {5 v! |7 U- i; r
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
4 ~( M q: j6 s' [9 M
}
; t f1 e7 P: X' Z3 {! e. z
}
6 y5 Y* Q* f' _' d) n: S
}
: t) H6 @8 \; t# t
</script>
/ T: O) s2 s# p+ h" V- L+ Z9 j
( X& B P* |& E9 ^6 U& _
<form name="combo_box">
1 U: C7 t# {0 g9 s" G* X" r
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
6 s3 d% L+ G) d! @ y1 _2 T8 c0 p3 q
<tr height="24">
4 p; W7 ^1 V, d5 q N2 q
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
# ^; g) K' r0 |7 \1 U
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ J8 i) g- p) I& @! R9 W- P
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
' b" R) P, s$ B5 w/ h \/ J
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
3 u6 h r& v9 k, q: a) A
</tr>
) @7 j1 y/ C, A
<tr>
/ X- \# }& G% p5 r. R! N4 Q' J
<td>
) Y. r0 m$ j" ^9 ]& A* ~) w2 t" t7 \
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
* p6 Q. \$ r( U5 t
<option value="0">请选择部门 ---></option>
_* n8 w0 |. ^# Z
<%
8 S. s. p% U+ E9 l" ?( |) t
string sqld="select * from tdept";
: f' r0 [$ K9 s: s/ M$ w* g' G1 M
stmt=conn.createstatement();
2 O" d& R j: W+ d/ R6 \% t
rs=stmt.executequery(sqld);
8 l: v2 a5 A+ q7 e c
while(rs.next())
4 g6 U' A8 e" L
{
# r% E6 q3 k0 `
%>
6 ^, B* ^' t, e, S
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
; r+ ~' @: Y1 L; V% |/ `0 t& X* T4 P
<%
7 q* U7 C6 f( q2 N
}
" l* h( q. R. h
%>
+ b, U, r* G. R
</select>
1 V. U$ l7 j2 p, G2 m0 Q( N9 W
</td>
# `3 ^# w& Y1 d& F: n9 L3 a
<td>
, ]: u& U z6 X9 B5 A
<select multiple id=city style="width:150;height:200" class="bgc">
+ E* I$ X. z4 ^( |, _* F: w' F
</select>
: G' y8 Q5 u2 J6 t3 u0 i
</td>
1 c8 X9 q7 B3 v% K
<td nowrap align="center" class="bgc">
9 M* ~$ Q0 S- I$ s2 G b
<input type="button" value="<<" class="buttons">
$ B' _2 Z a6 T7 H
<input type="button" value=">>" class="buttons">
* X1 `- E) o2 j+ E% j& ~
</td>
4 |' J0 L7 {& M& V! x6 W6 B( y
<td>
4 T0 Z% u& J4 w2 y! T. c& h
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
7 K, y3 F) q8 ~" h
</select>
# b* N' T7 ~8 u0 ~- O) A0 y& Y2 k
</td>
% z( f% h" J7 V
</tr>
/ B, a I1 i$ l) F
<tr class="bgc">
% S2 W5 H; F* h; r
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
, b9 b: ^+ m4 o+ s
</tr>
+ J' R7 Q$ \% z' z0 k
</table>
; o9 a9 S& Z: V& S
</form>
/ l8 _% s: O4 l; W9 h" B% M
<script language="javascript">
6 v3 H- _/ W8 s3 T0 W+ N
//人名移动
2 G* H! y0 _! W; f; R- j
function move(fbox, tbox) {
0 Y( i& @ Z. t# V- w6 f
var arrfbox = new array();
+ S' m* L4 L7 z& _3 e |
var arrtbox = new array();
- ?7 B4 g6 h: M$ v; Q& d# e
var arrlookup = new array();
& _6 r2 j4 I1 W) g W2 `
var i;
6 K0 @) |" F1 K5 {/ c
for (i = 0; i < tbox.options.length; i++) {
5 b. A# f/ B4 s! @8 Y9 V& k. E
arrlookup[tbox.options
.text] = tbox.options
.value;
6 z7 q; y8 f5 R' f
arrtbox
= tbox.options
.text;
& ]6 z2 X5 k0 V( p& Z H
}
3 m. l6 M) U) H* l# I" x5 o
var flength = 0;
9 d4 @: e+ ?/ F0 \
var tlength = arrtbox.length;
$ a: W4 @0 `' `. h$ h8 j- I
for(i = 0; i < fbox.options.length; i++) {
# r2 z+ W( _" ~( M/ d1 W
arrlookup[fbox.options
.text] = fbox.options
.value;
( U% c4 f5 N, o
if (fbox.options
.selected && fbox.options
.value != "") {
+ M8 A% C G- v0 l$ t$ j
arrtbox[tlength] = fbox.options
.text;
, ?0 z( R5 E5 U# h: T
tlength++;
& I+ o$ p1 l9 P0 r2 A; O: t9 _
}
& r# n o2 a$ H4 }
else {
$ f$ ?: o# w& i0 e! o
arrfbox[flength] = fbox.options
.text;
* R* |. A; B: x2 o
flength++;
; k5 p9 g+ T/ y1 v3 ~+ f$ p1 P
}
! ~0 E) c+ n3 X- t* r
}
: J% `+ c% {) H% I9 W2 e
arrfbox.sort();
3 E2 x! { O- ?% J2 D9 p2 n0 z" }. ^/ B
arrtbox.sort();
" b4 B0 e3 l4 l% ?% h/ k* i
/ u/ ], D) T# s6 u. q. t: J# i
fbox.length = 0;
- h% ~5 k+ u$ W( c; L0 r
tbox.length = 0;
4 E& W' ~/ e ?; |% r
var c;
8 w6 x" k; b8 B$ q9 ^& f
for(c = 0; c < arrfbox.length; c++) {
5 L& {) A0 H2 s. N6 \" A4 a6 x
var no = new option();
- e9 q$ Z+ v5 d8 I
no.value = arrlookup[arrfbox[c]];
; b# z, O: C, _. I/ M' G2 y
no.text = arrfbox[c];
$ u0 D5 t7 I) N9 t8 ]
fbox[c] = no;
3 A" o) l" u% ~ ~* T
}
& g9 \8 P" Z9 g1 U" e" g* A
for(c = 0; c < arrtbox.length; c++) {
0 e- i o+ E" z! N1 B9 X- b: W7 K
var no = new option();
$ }5 x' k/ n# @5 K$ V. I
no.value = arrlookup[arrtbox[c]];
& |5 J+ C8 h/ v) l: ~
no.text = arrtbox[c];
; A- }; `3 Q' A. W V1 j
tbox[c] = no;
& {6 ]2 V4 z! y4 P+ T# h
}
/ F/ l) v% s) Q" a# z5 b
}
: V9 ~5 i2 F" ~- W& u/ o
</script>
7 c5 _" N6 P! K( A9 x3 P/ o; {
</body>
) ?8 e0 ^) R, H6 x
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2