标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
) b" V# V' ~7 r$ I* ?
c pageencoding="gb2312"
6 I. E; @! C5 Q" T% c* k
%>
. @8 G7 W4 t& p/ n7 u
<style>
' k! ]. h+ e9 w4 t& C/ A" E; N
.f9{ font-size:9pt; }
9 z; i) w+ U% z) ]: ~% g k' t
.bgc{ background-color:#aecaf9; color: #0033ff }
5 D& V/ e0 O& i+ G
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
( e7 v% _5 d# o ~3 Z1 O2 C! g
border-bottom: solid 1px #4e7dc1;
! b, R- e- k% a8 g! R6 w+ `5 n
border-left: solid 1px #aecaf9;
9 m9 u) H! {) a: Z- L2 a
border-right: solid 1px #5679bd;
+ O0 N! p/ I8 w, B
padding:1px;
* b3 S8 x* r, t9 q- ]
margin:0px;}
: M0 ^$ V0 x/ k. e2 y% y$ g0 I$ E1 R
</style>
; S5 I# w) _6 b5 n
<script language="javascript">
. J; L( \6 b2 d) @, O0 q2 i0 U
<!--
! n4 ]# e3 o$ B9 i- b
function rv()
8 X' `1 W6 [- {
{
7 I H ^' ^4 \5 \
var val="";
; O3 o) Z0 Y# m- ]% p
for(i=0;i<combo_box.list2.length;i++){
x4 H+ w0 J& m; B& G
val+=","+combo_box.list2
.value;
- H" E0 h8 }+ A6 z4 m2 D& _
}
' |) V' Y! [) z. a% ]
if(val.charat(0)==","){
! }6 h3 N% }& [5 o9 p
val=val.substr(1,val.length);
$ X% W5 M- F$ {* r2 V
}
0 V2 p: D5 l7 J0 l4 R+ K, ^
opener.form1.frecname.value=val;
( z/ I w6 M. q6 v
self.close();
7 I7 A7 S0 C2 y" a6 D# H3 s
}
$ I+ j1 Y$ D4 A% X4 D- v1 m
//-->
! T2 S* v: }( g# K/ {. t' _/ b
</script>
( k, f# y2 ~% y K1 Y& w
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
) P2 h5 | t( W
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
% g$ t* A4 @1 ?% P7 X0 y& l
<%
$ J1 y5 J/ B; u4 e6 r" v
cdatasource ds=new cdatasource(); //数据联结bean实例
! i4 [* _7 U" c# Q1 o
java.sql.connection conn=ds.getconnection();
! E- {8 q2 y8 B
java.sql.statement stmt=null;
* ~% E# O$ N- a
java.sql.resultset rs=null;
! A" G" [- H# m* H* R; j# J/ k4 k
cdatacheck dc=new cdatacheck();
, D; Z. L! D6 |' O- K
%>
9 |+ \6 |/ q; _+ _
<%
2 v) {1 n J4 P. g9 L" C
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";
) R' S# S0 P6 k$ `4 y2 O
stmt=conn.createstatement();
% q6 w0 V! }+ h# H6 Q$ m
rs=stmt.executequery(sqlu);
% T2 {' l8 N3 c
%>
% T. W8 r/ @: M7 g
<script language='javascript'>
! j( S2 P* \( v) |6 L, _
arr = new array();
( {% \- w& k# j* k2 [
<% int temp=0;
" v _) h1 w8 X) w. H, z" W
while(rs.next())
' t5 a1 X, a) T0 p- z& n: n
{
, H5 j q+ U% k8 H/ X. [$ k
%>
0 t* J: E1 _* M
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
5 `- f: b" E! U: c! O3 w+ D
<%
$ X* C* r E- @: V
temp = temp + 1;
2 a% f) J8 r8 c$ E8 y7 P
}
# k, h+ m6 |! p h% y/ l3 G
%>
- }, X( I5 Z4 j' G7 f* |- |; Q
temp=<%=temp%>;
9 M8 C% g4 K1 A7 k4 C1 S, F: T
function changelocation(id){
Q7 [) \' B1 }9 G1 d
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
( f2 A# F; ^6 \
var i = 0;
1 t# C! G6 }9 h
document.combo_box.city.options[0]=new option('-------','');
; G% h; d t/ A* Z T9 E
for(i=0;i<temp;i++){
& p4 @6 L6 E$ A
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
- N: H: U6 ^: H |! g0 u+ E5 g
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
: u; P& ?9 o. |. l7 O7 Y! c
}
& R3 d* x* s a: b! I: S- J
}
7 q f" u! a0 l+ e: ?
}
$ ]- _+ t7 E6 k% I6 e! R
</script>
9 y! P- O5 v D$ M/ U2 p
U3 q( I, U' u) D% O; F
<form name="combo_box">
" ~7 F; G9 S) i9 X* `
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
. D# `- L1 w2 l) a( z' C
<tr height="24">
8 a& ^* @1 {/ M' J
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
' O' h3 Q. [, b
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% x; E, ?6 }- [: k2 i+ K
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
9 W/ ^/ v, i" }6 R9 M/ d, L4 l! R$ C
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
. p) D- I* v1 J G8 g, m% V5 r
</tr>
% @9 [# d5 n# g
<tr>
) _! u/ c9 p$ s: k# l4 O
<td>
8 S& v0 W" _. B, G0 \
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
3 @# d" r% i( c' `: A& l
<option value="0">请选择部门 ---></option>
5 q1 I# ^* K; e! H& ^$ O/ H- V$ H
<%
1 \& b0 t4 T# N6 g0 \1 a7 R) V7 u
string sqld="select * from tdept";
8 W2 n4 @: o" `' E* \: z0 p8 B
stmt=conn.createstatement();
; q' F, ]# _; a1 C. o0 J5 E; x
rs=stmt.executequery(sqld);
8 u4 {/ y3 S5 V [! R+ D! u
while(rs.next())
$ M, a2 I. y# I0 d) X Q
{
+ \; ?% m9 V9 x, j" T" Z
%>
' O" r$ a9 q2 q" `7 C
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
, p- m/ l+ i @! W
<%
- v# k8 @6 O0 Z/ C
}
8 N* x" ]2 v# l# b
%>
/ c+ N7 V6 u$ K' K5 i: d4 \
</select>
9 y1 B0 R, ]9 I7 M! e/ F" a# \
</td>
! B4 H( e+ j+ D4 m! C' c3 t1 x' P
<td>
2 Y8 u) W( [1 k" a. z# ~
<select multiple id=city style="width:150;height:200" class="bgc">
) v( Y8 [3 M6 a0 Z. G
</select>
# b4 d7 H1 Y, |- H7 B
</td>
, q# \: `% w( [
<td nowrap align="center" class="bgc">
4 A3 Y* Y, c' U( T) w( {' K4 _
<input type="button" value="<<" class="buttons">
* d1 g. \& F# X' G. O" j: ~
<input type="button" value=">>" class="buttons">
2 G( W* q5 p( _' B ?( B) x- k. K
</td>
8 J, O( [8 W3 ?( M
<td>
9 E& F8 t$ l/ A% N# |2 O3 i- e5 P) q
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
3 b9 C( I. k# Z* B, x
</select>
' ?# l- P6 [; d
</td>
0 d5 Q( R8 A" |8 B
</tr>
2 L* r3 ~* m4 e$ A/ b+ O
<tr class="bgc">
: x6 v. `1 E- l1 ^
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
, y4 p& `4 g( ?% j9 c$ `
</tr>
: D1 U1 j% R6 ]& F" {- z) _5 }$ Q
</table>
. B$ d7 ~/ U4 s) d
</form>
9 B; E4 L3 t0 E- Z
<script language="javascript">
* f. ?' |' x4 I7 G' f/ K
//人名移动
* s; Q w# K6 l5 r( p2 A+ B6 Y
function move(fbox, tbox) {
& {$ L! P2 L% T. A d" V. G0 P) a
var arrfbox = new array();
/ e* m5 r+ L7 B* U/ i' J1 ~1 O
var arrtbox = new array();
; J& m1 x1 [2 q1 @/ T- l/ r
var arrlookup = new array();
1 J, x2 k* E2 ]5 @' X
var i;
# ]. ` i2 l& C3 G6 o, L6 @& X
for (i = 0; i < tbox.options.length; i++) {
1 w* W' ?! Y/ I/ a
arrlookup[tbox.options
.text] = tbox.options
.value;
7 v0 ?: h2 d, P: {" @1 p4 P* |& \, j
arrtbox
= tbox.options
.text;
' P O) N# r% D. r
}
* e) Z: e5 w! W' q' m
var flength = 0;
3 K* n+ ^. }/ \
var tlength = arrtbox.length;
8 E# d! [! C& ^" F3 H
for(i = 0; i < fbox.options.length; i++) {
0 ^! X, k9 K# \, g( g2 m7 W
arrlookup[fbox.options
.text] = fbox.options
.value;
' l! U3 P% v q6 Q* M Z, H4 f* t
if (fbox.options
.selected && fbox.options
.value != "") {
1 D9 o1 p/ ^; X9 ]: t+ [
arrtbox[tlength] = fbox.options
.text;
& B/ U; u$ B* Q6 B& L( \% U
tlength++;
. Q$ f" M: O. V5 m7 n
}
# j3 E4 f, d. `. c' ?
else {
! T0 r" R4 O# L+ F! t4 u
arrfbox[flength] = fbox.options
.text;
1 F/ w7 r; _7 ?+ P. u+ W6 h
flength++;
, ?+ S I) B, G5 I) Q
}
8 K9 r* d! W! K3 ~3 W
}
. Q$ n2 L8 \( B# }
arrfbox.sort();
% g0 H2 p5 G" f; ]9 \7 O; [
arrtbox.sort();
9 [! _" m+ _; ~& j8 G1 h' s
: T r9 I. |' n# y' s
fbox.length = 0;
* F% I3 E8 ~2 g* ]* w
tbox.length = 0;
# h% S$ ?' d i/ `5 N* }, u' L
var c;
# L2 q- g- b% q( u" m9 f3 `& |
for(c = 0; c < arrfbox.length; c++) {
. h9 J0 C. o! |0 B/ b5 q
var no = new option();
; x4 y4 e. X' n3 R t
no.value = arrlookup[arrfbox[c]];
) |& o) q. ?/ H* ]) W
no.text = arrfbox[c];
! {* ?$ B! U2 W5 n3 l6 k7 O
fbox[c] = no;
5 Z: k2 q4 t& {. J* V
}
- \; T1 W- y g
for(c = 0; c < arrtbox.length; c++) {
/ N# h; x0 ~: I5 i: O( O
var no = new option();
0 t# F) y; S s- w' k, ^0 Y5 l- y
no.value = arrlookup[arrtbox[c]];
3 }" A! x- s8 X5 c3 t
no.text = arrtbox[c];
% n: ]3 u+ ~# q; g( P& k
tbox[c] = no;
( q' a) B! I' s8 U, H) w3 B3 L
}
; i- ]% M+ ?# y9 s
}
/ b4 f! N: ~* J( j! j- w9 L
</script>
& ?$ G3 Q) I) v" h& \7 C. P- b/ K
</body>
3 S% x7 Y. W9 `" L- w- g
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
