标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
6 v' p! {" M2 Y- u
c pageencoding="gb2312"
* J. p5 I6 b; e
%>
4 m0 P* C- J" {( b8 m
<style>
, H8 I. W! v. E" L
.f9{ font-size:9pt; }
; G: a9 L, n- E! ~5 k; u
.bgc{ background-color:#aecaf9; color: #0033ff }
0 c: D" `# J7 n6 X( U( X E, G+ i0 S% F
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
- {: q; @" c* f- ^
border-bottom: solid 1px #4e7dc1;
& i( O, y/ y, A3 t' p( {4 K
border-left: solid 1px #aecaf9;
& r# L) g5 {9 d+ ~6 T
border-right: solid 1px #5679bd;
6 M. O7 ~% ?: ]# l) w3 v$ ~
padding:1px;
0 Q* U6 e% u( `9 E: {9 L5 [
margin:0px;}
* Y3 v; w' e; @: ?
</style>
) g* i Z9 ~$ ~1 x
<script language="javascript">
5 L" V" L# D5 w$ r8 k1 i5 _
<!--
2 x4 Q% B8 q! e" C3 p6 ]
function rv()
; |! R: {, s! @: r
{
) C3 V1 @: @& R2 O
var val="";
$ X6 H8 H' m" r
for(i=0;i<combo_box.list2.length;i++){
5 r8 A! {) p7 f4 N4 e1 n! s* Q- T
val+=","+combo_box.list2
.value;
2 G6 ?; ?/ q% ~; [+ D! `+ n
}
% Y, Y Y+ Z, S* }$ y
if(val.charat(0)==","){
& `+ y3 Q/ [* O+ O1 n: c& {) n8 D
val=val.substr(1,val.length);
: e! G8 o0 }8 [% s
}
+ r5 ~) t1 V! X
opener.form1.frecname.value=val;
' V6 l3 {# r4 R" S4 \
self.close();
0 ]% k5 m F5 y: c9 h! O9 i9 a
}
2 n6 w6 N) N& n: Y( u' d s6 n( q
//-->
7 J7 |- g) Y% D
</script>
% [1 i, B5 Y6 D1 n* y
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
4 H. e0 Z0 Z8 U% [( n1 w* N6 n
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! z! P, C: D4 P; _( d1 H3 R
<%
; Z8 J! I7 ]+ U6 q+ V& @( Z
cdatasource ds=new cdatasource(); //数据联结bean实例
0 b( u5 {2 M5 F
java.sql.connection conn=ds.getconnection();
G& E2 e% w2 E
java.sql.statement stmt=null;
$ H- t" v* m0 \3 g; Z& k1 G
java.sql.resultset rs=null;
% n8 m B- v" I* F/ S2 D) l- p
cdatacheck dc=new cdatacheck();
; r" D' R3 G2 q* o, t# y
%>
: W. g, a1 ]+ a: v( E
<%
7 F: q* z; I+ S0 a8 k! f
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";
/ t. W. q1 M+ n W; x( j
stmt=conn.createstatement();
4 J- J# X/ X0 M
rs=stmt.executequery(sqlu);
) P3 E3 t5 V1 \ U/ |1 k/ D3 |$ M
%>
9 K. s1 r/ j2 M7 C
<script language='javascript'>
( `# ^( b1 |) w( H- M5 Q. I* O* e
arr = new array();
$ V: y; f! [" ^8 v" [; ?5 O/ a& S3 \
<% int temp=0;
+ _1 i: f4 E# K1 m7 s
while(rs.next())
$ m$ o+ C* {7 ? K& u
{
# M$ j& E1 f' R6 Z) V6 g
%>
. M5 e, }, G+ u
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
4 b" \' e) R& {7 H8 ]% b# v3 f
<%
. B) G6 n, i6 ^! @/ T, \1 O
temp = temp + 1;
4 }" _2 b$ a7 i! b% Q4 n
}
5 z( u& K: B, y4 y* j. ^ ~5 e
%>
- T2 {8 J U4 I# \" C
temp=<%=temp%>;
6 D3 j# Q/ G) T a9 e% V$ B
function changelocation(id){
+ V, F& Y% e1 C r3 `8 l! G' ^
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
+ }' S1 O* F" [# K: U& G: F
var i = 0;
; l3 X) B$ I$ O7 T" T! f
document.combo_box.city.options[0]=new option('-------','');
4 W7 ?" M* v+ d% ~8 I
for(i=0;i<temp;i++){
9 i" G3 I4 C* C& k& \' _. a. c8 b
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
4 N# v2 X& U. w
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
' r5 s# v5 F2 O) s# n
}
% s% Z% F' G" c7 q/ z" H
}
& @7 R+ n) p8 U) O3 }
}
: o6 M6 e g0 \) ^
</script>
7 l, M! k# R8 H W+ o% a1 t
- j# P* E5 S; O1 M
<form name="combo_box">
' Q9 \% n' h; I* `+ q( K
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
+ t0 R6 t9 R: F* A& z8 ^; l7 ?
<tr height="24">
% w- k g& o! `4 \9 j. E, Q$ r
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
8 j8 y4 F9 F; T( F) @9 w
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
9 c; D; U) `& ~0 G0 U
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
1 K* [) S/ M) ]2 O, [' n
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
! k* F8 ]( K' u0 {% N1 v
</tr>
6 A% @9 J) v2 y' |. c3 t& ]
<tr>
g) q: _; Z/ B8 }
<td>
( g8 K7 [4 A) Q8 N- b
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
$ N5 [6 f+ e. C& c5 I8 ]) {
<option value="0">请选择部门 ---></option>
3 `! o8 Q8 m1 \. n9 U+ ]+ t
<%
. S+ ~( D9 G- }) ?7 M; q* m# y
string sqld="select * from tdept";
9 Y) C3 u1 V: D& E1 c2 r
stmt=conn.createstatement();
4 |9 [& X' T' c# S+ E
rs=stmt.executequery(sqld);
1 _0 E* _/ V' W
while(rs.next())
3 E3 ?, z/ e: |- E9 ^
{
& Q' N& h/ M) K; R1 j
%>
' `: H8 l: ?+ A( F7 L* L
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
) _. T0 r4 l! {, u, K7 q" j
<%
8 r' D& |5 s" |5 {8 l9 k4 g v
}
3 I2 m5 f; I4 l/ Q C G) l
%>
5 Q8 h! F( r0 I( X
</select>
% d9 T5 \# h5 ~/ y9 ]
</td>
& U1 ], A) D5 m; F/ I# h3 z
<td>
5 n; [; Z9 B8 Q5 H5 D3 _" R
<select multiple id=city style="width:150;height:200" class="bgc">
8 I8 ~! ?7 y/ o; V3 W6 G
</select>
, M. n5 D; j5 f+ Y6 \* w l
</td>
" s& g' M3 O# D4 B8 g5 Y- H _
<td nowrap align="center" class="bgc">
3 A0 t* N, K+ M' [
<input type="button" value="<<" class="buttons">
j/ n T4 j6 Z: V0 ?5 ~
<input type="button" value=">>" class="buttons">
& _, S4 X" `3 O9 g2 J
</td>
. F9 }: S9 b- y0 y% e$ Q
<td>
" @5 b1 D( Q3 d7 z
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
1 A, W$ U: z- X
</select>
5 U- J7 I" U0 L% Z; P1 A
</td>
1 \# A0 y1 R/ o) B3 ~; l6 c
</tr>
& N6 P7 K0 l# u: {5 a) [/ t& a) ]
<tr class="bgc">
& c2 `8 G5 R; ?
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
% c7 x" t0 \) H/ C3 Q2 v
</tr>
- N$ t3 p. B0 I8 w
</table>
# |7 v# ^, A3 x5 C0 R# u9 e( V9 H
</form>
& Z F! ]" |: [0 f9 X# G
<script language="javascript">
( Q; }8 t5 v6 H1 I
//人名移动
4 `1 Q7 M1 Z- z
function move(fbox, tbox) {
! M4 ]" ~1 P2 }# F/ p
var arrfbox = new array();
7 k9 Z+ B; d5 v0 v0 y1 |: x6 ]
var arrtbox = new array();
1 B5 V2 |5 y6 B+ u9 Z* t5 y
var arrlookup = new array();
3 O. s8 k* v6 N6 S
var i;
* v: \( E+ S) D' D! y9 m' l# t
for (i = 0; i < tbox.options.length; i++) {
6 h6 B' f& V2 \3 q% b0 ~
arrlookup[tbox.options
.text] = tbox.options
.value;
5 J, a& ]- j# T( c, V
arrtbox
= tbox.options
.text;
+ i* w2 z0 m0 q5 D
}
+ t, r$ f, U8 i: S9 x
var flength = 0;
" E/ |6 Q7 C3 {$ p
var tlength = arrtbox.length;
6 \" S2 }" {7 U/ ^2 T( }+ O
for(i = 0; i < fbox.options.length; i++) {
: j0 U5 I6 I# B/ U# `
arrlookup[fbox.options
.text] = fbox.options
.value;
. }. {' M$ k5 S8 i( _ a
if (fbox.options
.selected && fbox.options
.value != "") {
6 X; H! n) v: A: A
arrtbox[tlength] = fbox.options
.text;
5 {0 m7 p O2 ~/ v; A4 ~) P& h) O
tlength++;
& R# b4 W( @& ~! a$ O" [
}
5 Q" f# Z( M) ]8 [3 d' @: O7 h7 e
else {
# a6 F/ T1 Q# F8 e. B2 {4 f# c
arrfbox[flength] = fbox.options
.text;
. P; y' T8 j7 I$ k6 \( [
flength++;
5 Z! `: ]$ ]+ m3 Z o
}
8 w& S$ f: _8 Q+ B
}
. T) l! R. a, M# q4 A7 t
arrfbox.sort();
7 {9 z$ u4 a, y0 t
arrtbox.sort();
( Y: _! P" v8 ^, h, b* F: G K
c* @1 d+ n- w4 B- j
fbox.length = 0;
* a; g( H7 A; Y* e! p" |; [- J
tbox.length = 0;
+ V- @6 [0 A* k. q9 ] G+ w9 t
var c;
! Q: y5 k6 Y% U/ ]9 j( n9 a6 V
for(c = 0; c < arrfbox.length; c++) {
b# e5 e: g, A! _8 I
var no = new option();
9 G( p- D" G1 J( u! m
no.value = arrlookup[arrfbox[c]];
9 P8 ?/ J) G( }8 i/ Q
no.text = arrfbox[c];
0 [5 m! W( {+ f2 D& N2 x+ ?% w
fbox[c] = no;
/ o g! I6 ?+ ]2 q L# D3 z
}
2 y& z, Z+ j( f Y! B, t( a
for(c = 0; c < arrtbox.length; c++) {
& q" e& `+ D. g: |
var no = new option();
" e- t% v+ ~: H5 h# V$ @
no.value = arrlookup[arrtbox[c]];
; a, ~3 ^/ G3 E. B) y, G1 h
no.text = arrtbox[c];
9 K! a0 i1 T$ g6 x9 p
tbox[c] = no;
9 z# D) T: i8 c2 c
}
i( |; E) b/ }8 A0 c, y2 V
}
3 m; I1 @9 |$ H
</script>
G- }. m; Z. l+ [1 Y z
</body>
* _* L( p# Q( u* m( S% ]
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
