标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
2 w$ U+ I) E; Y8 q" P
c pageencoding="gb2312"
B; E$ D5 Z. J8 X4 ^
%>
! m# Y+ ~. u1 v% S6 C
<style>
5 k C; ]1 d' o3 f3 ?3 c8 d
.f9{ font-size:9pt; }
: Z4 P1 m: N" R* ?/ m$ Y
.bgc{ background-color:#aecaf9; color: #0033ff }
. f# x# w4 O, \
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
/ v! m2 U! h3 _+ y
border-bottom: solid 1px #4e7dc1;
1 ?% D) B7 x- t
border-left: solid 1px #aecaf9;
+ _& {" W( E! Y% K( v! `: x% C
border-right: solid 1px #5679bd;
# M/ t% { L! ~+ P
padding:1px;
5 G& S7 ]( j% F. b0 m
margin:0px;}
8 ?1 O9 }6 v$ a
</style>
4 S# n% z* d8 g( X: R/ _. R: `
<script language="javascript">
; w: `! v$ [) V7 A# F
<!--
# X( V h- j& s+ K& z
function rv()
1 W# b4 e2 P6 U9 n, U0 w6 w
{
4 a. g* {3 J- K/ }
var val="";
$ Z$ [; M2 p/ ~" ?
for(i=0;i<combo_box.list2.length;i++){
& P% {4 [6 V4 D2 z& ?2 U, \/ n( f$ k
val+=","+combo_box.list2
.value;
/ {, R3 g. O# `
}
/ \ i' ]+ c" o9 z
if(val.charat(0)==","){
9 _9 x+ `9 ]! o! H
val=val.substr(1,val.length);
7 f+ a5 @, a( L
}
, u. k& M' _7 c
opener.form1.frecname.value=val;
2 o: _" S0 E" L4 S% i+ [9 Q( v9 [
self.close();
6 n( s& N G; ]6 `, ^
}
& g6 i$ s/ E# u3 H' [, {" E1 a
//-->
t& V0 c9 R* {/ v q# ~
</script>
" m1 B& _ \$ |" c3 n; s% W
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
/ W" G4 h F( T, e; ~8 |* V
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! ~$ B8 U& E# s. s9 O \
<%
7 Z. {$ H! |! b% [
cdatasource ds=new cdatasource(); //数据联结bean实例
2 c9 j1 e2 K+ O
java.sql.connection conn=ds.getconnection();
9 I! I, u3 g' b, m
java.sql.statement stmt=null;
4 q. \. X! W) q% o' e
java.sql.resultset rs=null;
1 E' a" ~, ~7 `
cdatacheck dc=new cdatacheck();
4 T* A3 M( j' ?; K6 a
%>
/ g( _# v W, m- _
<%
! J( c5 z/ _! s. X) w
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";
( p/ G! e8 l$ M6 o6 X5 [3 l0 s
stmt=conn.createstatement();
+ C9 Q- a5 B2 S
rs=stmt.executequery(sqlu);
1 A" Z( n" B! P
%>
+ `! b4 N( i2 \' s' Y' ~0 l! m9 ]
<script language='javascript'>
6 B" L/ s- \: s+ a
arr = new array();
8 x" B) b3 R* ~. f
<% int temp=0;
5 ]. i( P% N9 V) x5 S- m9 V; O0 l
while(rs.next())
/ a, l4 ^$ {# v& a- ~
{
; ], a3 e, T. M( {) s7 Z
%>
" A8 H3 Y0 E/ M a0 L4 r, V
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
" b2 k5 A% J& u- M, O
<%
- {( w7 ]- }7 Q* h4 k$ G
temp = temp + 1;
o* S, d8 {5 C: K7 X7 i, Y* {
}
: |. Q6 J' W+ c2 z+ }) @5 t
%>
5 d9 y# J# Q# W# f
temp=<%=temp%>;
. W8 F" t5 _5 I1 U( q( S
function changelocation(id){
1 I* o: A. z! K
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
0 B6 H0 c) K# ]1 f) _, ^
var i = 0;
- T5 y, N" a6 r- g
document.combo_box.city.options[0]=new option('-------','');
) l7 \/ q9 C4 g. s
for(i=0;i<temp;i++){
9 A8 E: J( {& Y, z% S8 ]& J5 g5 I
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
! ?5 F2 d, F6 t6 M" s
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
: q" T$ R) P! S4 w$ C
}
k7 q4 O$ x+ ]0 w u! w, O5 Q
}
9 l0 x# v$ d5 C$ V
}
6 b! m+ }1 j6 }" ~2 s K
</script>
! N- ?$ a+ `; C
$ @& n# a2 o: c
<form name="combo_box">
+ v+ ]4 ?$ g+ A) u
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
3 {' d" p. l: p$ r3 _' Y( `, ]% w
<tr height="24">
3 B/ `4 t- \" p* |5 n. }- y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
0 b1 M6 m& w& p& @1 Z3 s
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
1 F% N. F0 W' d3 W
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
0 k" b- l: U3 l+ e. X$ @- i" Z
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
; J4 t# e0 T1 t9 f$ A. l1 X
</tr>
1 j8 @9 P5 r" C; N$ F9 V% {+ X
<tr>
# \/ z8 U8 y: u7 s; z; G9 j
<td>
2 f; A, w' J7 l2 o
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
7 `5 b( S, F9 u; I# u5 c, o" y# y
<option value="0">请选择部门 ---></option>
6 L2 f1 q# w7 m1 S
<%
. F8 X7 I- x' P+ v$ r' Y
string sqld="select * from tdept";
0 W+ @- o+ q$ g- {8 E
stmt=conn.createstatement();
4 b' F$ z. [+ @/ H- z1 \
rs=stmt.executequery(sqld);
; N8 a& Y2 u9 [- z
while(rs.next())
& T. @$ M. P! u
{
0 M6 k! E3 Q N! {4 Z$ ^9 w2 p
%>
' Z0 y- y2 \: v, D
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ p. u& s' [0 b) s
<%
, j3 q7 B# s+ X/ {
}
9 N4 b4 W1 _: U6 c0 W
%>
9 O# W/ a" N- B1 B" t2 t
</select>
Z2 ^: d" Y( u% _
</td>
. ]8 J2 C4 k5 H7 K9 Y/ M1 M- z
<td>
# q: V) M7 P: U* Q, ^8 V0 V
<select multiple id=city style="width:150;height:200" class="bgc">
& t$ `$ `7 M7 N/ q# L
</select>
' O# S! u6 r% K) ~5 y
</td>
8 [7 F9 s8 i/ c- I$ k
<td nowrap align="center" class="bgc">
8 D3 s7 b; {7 h, P
<input type="button" value="<<" class="buttons">
. H I' U' t' b. X! B8 F
<input type="button" value=">>" class="buttons">
# n5 k$ O( V' s5 z9 n5 J9 l( l
</td>
! n1 x) e& N$ D1 `
<td>
) T9 X8 R' Y* Q; ~9 @/ s8 p5 L
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
, F8 ?. i( H# m3 f
</select>
" w7 x1 t* r6 j( a8 ~% x
</td>
+ y& a# m' q1 A: B
</tr>
) o- }; R9 ]7 K( Y x9 h
<tr class="bgc">
% R/ G0 U6 p8 ~! _, U6 F- h$ A
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
3 [( G* c# g: D" ]! g- C
</tr>
+ {0 c4 @2 Z: I5 c# A
</table>
& {- W4 v( T1 ?
</form>
" Q" [7 ?$ u5 B, I: e: _
<script language="javascript">
: \% A% d6 I, I0 D; d1 `, c* J
//人名移动
2 D C3 z. A" \. i
function move(fbox, tbox) {
0 g" T: l2 q9 A! y/ ]
var arrfbox = new array();
' h, C0 w2 s& B$ ~ w
var arrtbox = new array();
- ?& C3 g: P& O2 b5 p$ t: |! \1 A
var arrlookup = new array();
& ~$ M& _" e/ n7 w/ |5 y9 F
var i;
8 f9 ^' _- O0 H6 u' H" Q# ^5 z7 v" F
for (i = 0; i < tbox.options.length; i++) {
0 h! s, q' v+ X* i* B
arrlookup[tbox.options
.text] = tbox.options
.value;
, {! n7 K+ I$ G; [
arrtbox
= tbox.options
.text;
6 \7 }2 U8 o% V% L9 H4 D9 D
}
' ]/ E: W3 Q* i* |
var flength = 0;
] x! n0 h1 o, t+ D8 a
var tlength = arrtbox.length;
6 y+ q9 i3 G( m4 t# D1 x
for(i = 0; i < fbox.options.length; i++) {
s0 U( p; n8 ~6 y, B6 ]
arrlookup[fbox.options
.text] = fbox.options
.value;
0 @! O, D K: C5 p% @6 q
if (fbox.options
.selected && fbox.options
.value != "") {
+ j3 h7 H& U0 t8 S7 H2 p& p4 |
arrtbox[tlength] = fbox.options
.text;
; s# B/ ] p, N6 X
tlength++;
6 m3 }9 V0 K" c- {) @9 [6 N. f
}
, ]; q( g$ d. E
else {
; { x9 {% h* w) ?/ O7 k
arrfbox[flength] = fbox.options
.text;
1 Q* X* H% ?- k$ ^% e" P
flength++;
4 Z t" R3 n( |% {! K) N2 G
}
9 }+ \' Y R( }4 L1 |& l/ K
}
" I+ u9 G+ b5 q1 { q: Z* R
arrfbox.sort();
5 l# d7 P' \" d% r$ f
arrtbox.sort();
) T$ A8 W+ P. g0 C" z5 ?. \$ x
; ^% j, f# s: u. U
fbox.length = 0;
# g3 R. ]9 [/ W6 y
tbox.length = 0;
t9 r* u9 a9 Z* ~, N2 g
var c;
2 J- Y# [& r) V1 b- p$ N8 h8 ?
for(c = 0; c < arrfbox.length; c++) {
6 {. s' B) r8 _" v# p" l
var no = new option();
; D% K% p2 g h2 ]( O+ b
no.value = arrlookup[arrfbox[c]];
) G X0 o$ z* U% L
no.text = arrfbox[c];
: T4 D& p& h! X0 k, d& {* ]' s# n
fbox[c] = no;
' ^# G% B( u/ l! }# S2 ^8 u
}
4 M' T4 C, t5 h( ^5 y- s; e9 x! L
for(c = 0; c < arrtbox.length; c++) {
G) w1 p7 K% Z& Y; U
var no = new option();
. X: ?7 N' ]% p0 p, e& a
no.value = arrlookup[arrtbox[c]];
+ Z. r1 E2 ]) I/ g# ?; j
no.text = arrtbox[c];
# T% C' J, ^' m4 J3 F
tbox[c] = no;
+ w- B3 ]7 G# Y! }2 P8 E+ \
}
" Y6 M% A7 C/ q6 e
}
8 `- F2 U" ~# a+ _
</script>
( `; D) D+ K% w; V
</body>
( w4 M3 I! e6 i. o3 {
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
