标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
; c C/ \" i( f0 Y" ~/ l
c pageencoding="gb2312"
' r/ k4 [! ^/ L# e$ {
%>
, f( `2 \" j/ w, U
<style>
2 X, o/ V& q0 P: l
.f9{ font-size:9pt; }
9 `0 ^9 v' Y; W
.bgc{ background-color:#aecaf9; color: #0033ff }
/ Y) v+ D7 O' A1 R) t( z. B
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
1 d4 g) `; t' R
border-bottom: solid 1px #4e7dc1;
; v2 f5 m% P5 V9 F2 p; ~
border-left: solid 1px #aecaf9;
* x$ W% `" j5 V0 C
border-right: solid 1px #5679bd;
8 d/ _% ]+ t; x4 i
padding:1px;
, S: @& @3 q3 A, o! d% f
margin:0px;}
. E3 l$ d/ ^# M3 E
</style>
6 ^) D3 ?( {3 u! o; }' {# x
<script language="javascript">
; n6 S1 ^& n# L; Q. C
<!--
" n3 l; V: S) M: j
function rv()
f( h# B: D. u2 j, J' X
{
( t7 l" T6 e9 y D0 G
var val="";
1 M6 B$ f- d& J2 }0 L1 p/ {- `
for(i=0;i<combo_box.list2.length;i++){
0 H% i; w: N7 x% x$ e
val+=","+combo_box.list2
.value;
6 T5 T, ^* R' I8 P u. O
}
4 {% F6 c' v3 I/ ]+ v
if(val.charat(0)==","){
( `& E3 U; W' S$ I
val=val.substr(1,val.length);
- _, p( X9 x: h: G2 ?, g" f
}
) v% c) X0 D6 C
opener.form1.frecname.value=val;
7 l- i+ m9 D |
self.close();
7 o* q* E r: u5 b7 R. y
}
; A0 ?. R# S. J3 Z
//-->
6 v- t# f* X3 T3 j5 W; a, f
</script>
$ h1 P: D2 Q( y' }# i+ h8 s& Y2 z
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
8 H* ~& i, B; @8 _7 h, n
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
' i, ?& v. x5 W. B4 s0 k
<%
5 N3 j. v2 l! r4 b* Y7 Z
cdatasource ds=new cdatasource(); //数据联结bean实例
8 H* j5 z. r! s! Q3 R8 v* D
java.sql.connection conn=ds.getconnection();
6 U8 b$ J+ A( B' j' [+ f
java.sql.statement stmt=null;
' y! P3 ?# ?5 P2 } I
java.sql.resultset rs=null;
' B, N8 G: T% k5 }% ~
cdatacheck dc=new cdatacheck();
2 d. ]4 Z2 v5 c1 m4 p. Q, _
%>
- h5 r+ C5 M; Q3 ^
<%
2 r, N5 E2 s* M. r7 F9 g% V' 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";
- d) W/ C: f1 I+ U j
stmt=conn.createstatement();
3 b }1 T3 H( V/ a! x3 P
rs=stmt.executequery(sqlu);
1 j& b% s9 I$ N3 O2 p: C
%>
3 _4 I1 L8 t) @% j) R3 L
<script language='javascript'>
( n8 q/ s, ~( W3 k" i4 W$ l
arr = new array();
2 ^" r5 a3 R6 [# d3 ]7 I
<% int temp=0;
* x: Q5 |- \, |. ?' E
while(rs.next())
9 j# O3 \- }7 G" Z3 o
{
% x' R; e2 F" g$ V, B6 a/ ?
%>
9 }# E7 f. F O* Y8 b& f$ q) s6 D
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
) C# h0 C5 x) o" f1 d( K
<%
2 J; u& E& p( q+ ~2 E* i; e% k3 O# T
temp = temp + 1;
0 k% k( a7 X; @/ I- r
}
1 a, W) G* }! [7 Q2 g4 \' {+ J: m' A1 ]/ Y
%>
' N/ a, D; Q* X+ \# L, K
temp=<%=temp%>;
5 ^2 x' o& B* p9 o
function changelocation(id){
8 h) I- b8 u" _8 z. u( s) J
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
7 S. D" B8 M3 l( [5 [( a
var i = 0;
4 @4 G1 h5 z. ~3 U% k
document.combo_box.city.options[0]=new option('-------','');
7 r5 n2 P, ^$ _/ I2 m4 T7 e
for(i=0;i<temp;i++){
5 }& [ H3 o) m: l0 a
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
: L+ m' V( i. W/ ^
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
' B) y. Q2 z! K5 |7 ^" U5 s% I3 b
}
3 o( g/ C! }* O* u4 D' Z2 {! W5 i
}
3 _" i8 d$ n" @# w8 ~
}
+ x8 m3 s/ y2 ^
</script>
& _! p0 Q% K3 b4 O$ Z i
. t2 C- d5 u1 ]; N+ H
<form name="combo_box">
" U7 v, c( b) K
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
' b0 ?, E k0 A3 O7 T$ G8 q( j
<tr height="24">
; R$ A6 q& t0 j* {
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
! m2 U6 U: a/ o
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
* \4 k8 M1 W/ x8 h$ q$ H
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
; Z( m! |% h5 O( ]3 A6 w+ Q1 d ]
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
! j2 A: G- t' C- b& {5 Z; k
</tr>
/ \5 F1 P' A8 a3 X8 I& Q
<tr>
+ B2 ^! ?* F6 M6 I8 D6 M6 p ^
<td>
7 w& z# C5 Q+ `# f
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
8 n7 o4 _7 j* A4 E" @7 Y
<option value="0">请选择部门 ---></option>
0 z- R- g/ z; @8 m& m# y/ r
<%
' b R& W t# \+ w/ |3 w- n
string sqld="select * from tdept";
# y0 G9 \9 {) d: A; g0 s
stmt=conn.createstatement();
2 e+ G; @5 Z2 @% M5 Y V
rs=stmt.executequery(sqld);
! d% L& y2 k3 K6 @' r+ o' y2 M' r1 G% ~
while(rs.next())
) f8 ]4 C( X# h# f) |2 l
{
& O- H# f. u3 Y" w, u0 ?1 R
%>
5 _% C+ J0 X; W# [
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
# l8 q7 I' g" ~5 y! x
<%
! ?9 T4 ~0 \$ q* b G6 Z& c: |' _& m
}
0 A+ Z0 e# p! Z# v5 b8 d1 E
%>
) w$ l+ o' V& J" V/ }
</select>
% Q+ h, P+ P% r& _2 a- A6 n1 i/ @6 F
</td>
* |9 i) X* S$ w8 u/ b5 z
<td>
; t2 T, {# Z3 Q% ~( X' c
<select multiple id=city style="width:150;height:200" class="bgc">
9 A8 B- a- ~1 t$ k) X
</select>
: J. k& M0 A1 O6 [' O; p
</td>
/ \$ f0 K( T0 {0 @5 z4 y" q
<td nowrap align="center" class="bgc">
5 v, a: O# ^! t) |- [" i
<input type="button" value="<<" class="buttons">
5 i7 R# v% m" s$ _7 y3 g5 U
<input type="button" value=">>" class="buttons">
" ` X5 r4 n, y- S! O$ m6 g
</td>
9 \' m. j7 f" v. n- ^
<td>
; R9 g9 ]9 j C
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
- u- u8 D! u2 a! N8 o
</select>
. |. S' K# B4 p9 n5 H
</td>
" c* S. t2 `* L* `" Q& @: O% k0 P2 `
</tr>
* I5 y7 @9 X+ I [1 t- ~) M
<tr class="bgc">
) F9 O: d' D5 t
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
7 v6 w, F$ @- k. B3 Q1 |7 `: O; c
</tr>
" T3 \) _% R8 I+ u: F; T4 V1 W- k$ Z/ \
</table>
) c3 j& M: M5 c1 s7 b" e
</form>
. j6 Q4 P2 U) ~; }2 h( ]9 \
<script language="javascript">
$ R" I& j8 _! |& X1 m
//人名移动
% E9 H+ ^0 H9 h2 V
function move(fbox, tbox) {
9 y3 h/ H/ W2 Q$ r* N4 a% K( r& o) n+ N
var arrfbox = new array();
' {& D4 w; f7 Z I: A U5 I
var arrtbox = new array();
; e$ D8 n1 f8 @3 D
var arrlookup = new array();
; M% Z5 [" J9 V( N
var i;
6 J% W, m G! D3 n8 y
for (i = 0; i < tbox.options.length; i++) {
7 v! l( X0 Z3 s L( l) B4 r
arrlookup[tbox.options
.text] = tbox.options
.value;
8 r3 s7 F8 d6 R1 Z: p9 @! y
arrtbox
= tbox.options
.text;
. K- R& V, `; v: z: L5 a
}
, a, H/ [ z6 i# R* n: W1 K
var flength = 0;
5 C! `% {% S" v: C* T8 `$ r8 p6 y
var tlength = arrtbox.length;
8 H% y- ~8 V2 B5 M6 Z6 F$ K5 _3 ^
for(i = 0; i < fbox.options.length; i++) {
2 k; w- e" v* O. y- h( q
arrlookup[fbox.options
.text] = fbox.options
.value;
1 Y& A3 u3 e$ e: K
if (fbox.options
.selected && fbox.options
.value != "") {
3 }( ?) W0 j; r9 X* E
arrtbox[tlength] = fbox.options
.text;
8 N% o2 H, y. K, p
tlength++;
! }. g# P: |9 Q0 {
}
f5 Y: }2 P) [ ]! T% Y
else {
& ?; f v) [8 _% l
arrfbox[flength] = fbox.options
.text;
1 @* d/ }7 Z: R+ [" {
flength++;
2 f/ l, R0 e2 q8 Z# r7 p, Y
}
0 Q6 W! f4 b% R* R% O7 F! q
}
/ y+ y7 s- v; g5 n, s0 y% k( ?
arrfbox.sort();
! A& t# q4 [# @ o- T! J
arrtbox.sort();
, n8 G1 H) j+ V" d6 U& z9 P8 v: T
% [& y9 V1 O4 g' Y& c6 Y: L' X
fbox.length = 0;
3 ?7 x* P2 F% a2 k
tbox.length = 0;
f7 O7 E1 U. j1 x9 b3 r
var c;
3 |" m! o- I& I' E& C
for(c = 0; c < arrfbox.length; c++) {
: S5 [. K' Z. ]/ y' P7 ~! R2 o
var no = new option();
$ o6 i, p# M8 p8 t& |
no.value = arrlookup[arrfbox[c]];
* Q9 Z6 K! J3 d! W- ^0 L
no.text = arrfbox[c];
m5 e- t: ]' B, K
fbox[c] = no;
0 c/ s% f. i/ E* Z
}
@) E0 B: _* I" q, S
for(c = 0; c < arrtbox.length; c++) {
1 R0 y% g: D0 p' F( V! \4 O
var no = new option();
' V. P- ~" _; S! J
no.value = arrlookup[arrtbox[c]];
1 f6 F( [7 u4 W& Z& h% O( K
no.text = arrtbox[c];
/ m! |2 r' O, k- g+ q' n
tbox[c] = no;
. P; O. [% g/ q) J1 @6 v
}
: Q; D/ j! h& w' \
}
2 p ?1 r2 W! J. W0 f. K- E$ B
</script>
, C4 H% l' N% Y( n
</body>
) t# K+ s. `# H6 B8 [. c
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
