标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
- s& d, Y6 N# w/ M
c pageencoding="gb2312"
2 w; g8 b- S9 M+ S# n
%>
N2 J9 w7 k0 G5 ~# }
<style>
: N" m6 U0 S! U" A
.f9{ font-size:9pt; }
8 x4 b3 e* r2 u* J
.bgc{ background-color:#aecaf9; color: #0033ff }
) ~0 V4 O: s9 n; S" E. m% c
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
" C; S+ d: L4 m+ c8 _5 O
border-bottom: solid 1px #4e7dc1;
; |( @+ a8 K+ j( s
border-left: solid 1px #aecaf9;
9 x& J* U" ]/ @7 W- S. S5 o
border-right: solid 1px #5679bd;
( Z+ |" v: h/ n( I& h
padding:1px;
: p1 p! X2 Q7 T6 G
margin:0px;}
$ X/ i# O2 P% u! t- L0 W2 c
</style>
8 ?; i( S2 j& b2 ^% X# T6 X2 t
<script language="javascript">
0 N) A) q3 X! U. v1 w8 ?1 q
<!--
+ x7 t9 N8 w+ ~1 H" P
function rv()
" l' Q; a5 ~: W* M$ a& y
{
' {0 B! j3 z8 f% m- E
var val="";
9 b; y0 y1 P* s- K( l
for(i=0;i<combo_box.list2.length;i++){
2 j9 o8 J' _7 x7 X* {
val+=","+combo_box.list2
.value;
+ E. B6 [1 _; ]# I; Q# G7 u5 d
}
5 o7 w9 _( L: C1 F
if(val.charat(0)==","){
' B t7 x Y: w; y9 A+ P
val=val.substr(1,val.length);
" J8 o( q N: k# F1 j; w
}
- i# n* N7 l! p! l8 U
opener.form1.frecname.value=val;
3 _# L7 Z" }& r* l0 t1 l
self.close();
4 O) b# j1 q2 q/ S- f
}
0 e- l0 ~& ~$ _/ t, G
//-->
( r: u6 C' y% y. v
</script>
9 w; \. f& ~( L0 `) }: k. X
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
5 ]4 W. s5 ?: w( y4 K6 O
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
: c" |7 t. @. N
<%
- i O- s) `/ L# o8 j$ `& @
cdatasource ds=new cdatasource(); //数据联结bean实例
$ h `- B& w7 L& e3 `& X
java.sql.connection conn=ds.getconnection();
# Y0 ?% G- R$ y. @/ K
java.sql.statement stmt=null;
9 ]' {+ C+ x+ Y; ~1 |
java.sql.resultset rs=null;
& s, m- O2 }3 [; `; g
cdatacheck dc=new cdatacheck();
+ h" Z- x: @8 J( g6 x$ ~
%>
/ v' `* e4 O! i( G4 Q+ ^$ B
<%
+ G! ?! N+ D3 C6 q4 m- a
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";
q: ]7 X8 _* j& d: i
stmt=conn.createstatement();
; R4 M# g: g- e: { |
rs=stmt.executequery(sqlu);
4 @( q& M, E) B. r/ M
%>
3 y/ K2 r2 q) l
<script language='javascript'>
1 k* G6 X% }/ J" I- |. f- H+ ?
arr = new array();
/ s" H+ q I. b: ?3 `
<% int temp=0;
+ o. V, C8 A4 t% _
while(rs.next())
) @4 y& D. k J' K4 M. C
{
`) o3 B0 I7 J5 v8 E/ G+ W
%>
+ R8 r/ a& c9 l( |* m3 {& N
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
* ? k! k& K6 Q- r
<%
" a% n- X9 _4 L# t" I
temp = temp + 1;
w) N: b: B9 Q
}
% {2 [8 V* l7 b9 L: _1 n& H
%>
7 h3 K0 b& g0 o. S- t
temp=<%=temp%>;
+ F& V0 y J. i) C3 b$ A; m/ ?
function changelocation(id){
8 ~/ k) @% V& a2 ~, e. {" Y
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
6 t1 f0 u6 o. L& |
var i = 0;
* f* n# m* {0 R! q2 C
document.combo_box.city.options[0]=new option('-------','');
/ P4 R: v" t1 e
for(i=0;i<temp;i++){
. P5 K9 Z% T! p% G% t/ k" ^
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
$ k% U3 ^, P* u* ]+ @* n9 C W
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
7 d5 ^9 g& k+ d# @$ @
}
$ I- Z! {3 [7 L7 o, F
}
, o3 A' W0 g$ o0 T* M
}
7 i! q% v7 K$ @5 _) a: U
</script>
8 X0 j. {4 P D: X {# m
9 D( ~" d# b6 }6 E9 e
<form name="combo_box">
8 Q1 E+ [) s7 F3 ^
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
- V0 J7 x4 A" k) {) J2 P
<tr height="24">
+ u) h0 M0 {3 l \
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
+ N# S3 G" p5 [3 C
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
' |* [+ c* Q- U6 [: w5 {
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
% W: I+ q& t% l' G4 n4 H
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
F/ R6 o* r' y7 F4 h' N* N1 _
</tr>
3 A0 e9 ?% h+ S9 ]- B
<tr>
% a/ }4 m5 z. I R- y; O/ I/ ^
<td>
5 ]7 T3 @2 p; t# f
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
5 q" k$ W- h3 K$ p) r& u6 `
<option value="0">请选择部门 ---></option>
. b' n' p, M9 J6 j0 K$ L: h6 h
<%
, j9 N( l' D/ y0 d, }
string sqld="select * from tdept";
% \6 P i, @& F7 ]# i9 u1 f; b
stmt=conn.createstatement();
1 g( L5 x# z7 w; @
rs=stmt.executequery(sqld);
, }+ V. D% v: U% I% U/ v" }; T
while(rs.next())
2 _- s( |# v& `! `
{
+ N$ f- ]+ r9 Y$ O5 o. S+ D
%>
$ ~) e" J8 ?7 H6 [% P$ n
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
; _" Q) U& u. C* ~5 H: H
<%
$ v4 G8 r' a" s# J1 b K- s: }
}
) L; N C% I* G
%>
7 c/ o# f9 s5 T' V+ e9 }* f
</select>
% v( A. w" |$ q
</td>
: e7 ?1 K5 J R+ v) J3 `' l
<td>
. { y* d" z' n& D; Z$ h$ g
<select multiple id=city style="width:150;height:200" class="bgc">
4 g S! P% S2 W0 E% ?4 O7 y
</select>
7 [& P9 b! E' J7 m0 E! J# ^- M2 p
</td>
, {' _3 S j) H' `& k" z
<td nowrap align="center" class="bgc">
* I/ J5 s: f9 [. o9 t1 b
<input type="button" value="<<" class="buttons">
8 H( i4 {1 [' t) |
<input type="button" value=">>" class="buttons">
) W) Y* |. ]5 ^2 T
</td>
; M& g& w( E0 I/ ~8 Q$ x& |0 r; J
<td>
7 ?+ D7 t# l- z- g5 c2 ]3 P
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
; @4 P1 X m' M4 k! m% r
</select>
, t6 @; G" |, l1 Z7 G
</td>
5 ^) m4 i* M$ W, _3 w8 `8 g
</tr>
" N, P4 Y* R$ D7 @* m( a
<tr class="bgc">
4 ^! X( P( p& T
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
- [0 e6 r) B" j+ f; z- I
</tr>
/ A. Z7 X% E. q' m N2 ^2 _: I
</table>
" D* E: H1 [# x8 X# w- y
</form>
+ M7 O2 m0 R( ^+ l ]/ j
<script language="javascript">
1 e K& S% h$ Q& t
//人名移动
% w; H* B1 F7 S- x4 U% v+ {; h
function move(fbox, tbox) {
3 {6 P j- t0 |2 N
var arrfbox = new array();
: Z: n: E# M) n( W
var arrtbox = new array();
, B6 {; N% \8 ?
var arrlookup = new array();
2 D1 O% l" P1 a; F- L2 Y+ e) T
var i;
. q: _% d! N/ G- m9 v. y
for (i = 0; i < tbox.options.length; i++) {
1 A1 ?2 m* z/ c! k
arrlookup[tbox.options
.text] = tbox.options
.value;
8 `+ y2 K g) H) Q$ w. h- R. M
arrtbox
= tbox.options
.text;
' s$ w( A9 W' C; ^& F; g" |" x
}
' Y7 ~3 t( L) {4 D) L9 U9 }, @/ L) k
var flength = 0;
+ } Z1 g4 G7 \0 \# K. w. V- r% u6 m
var tlength = arrtbox.length;
" o I4 V5 o2 \. y9 j0 b7 ]* r
for(i = 0; i < fbox.options.length; i++) {
1 |9 J1 P2 y( ?; g% s" a5 v
arrlookup[fbox.options
.text] = fbox.options
.value;
9 B9 K9 f& ]9 u0 Q! q
if (fbox.options
.selected && fbox.options
.value != "") {
; m, H- J$ H0 s6 v6 ^+ U
arrtbox[tlength] = fbox.options
.text;
5 _7 l7 M, `. ?7 {' i
tlength++;
0 V, a, L+ _5 ?) ^: y: ~
}
7 n( X; W4 J, t: S4 J. }' V
else {
6 ]/ W) g0 N V9 U M* R
arrfbox[flength] = fbox.options
.text;
% @% Y. b5 z- U! a- I0 O K2 m7 {
flength++;
0 [6 k0 I8 o" V/ Z7 \3 U9 l3 S
}
0 J0 S, g! L: j& N
}
4 x4 Y* H( z9 a
arrfbox.sort();
9 X$ X( U! [1 U& {
arrtbox.sort();
; z- N( G; H; P# m" r- v+ P1 Q
- s) ]1 w& b- U2 {
fbox.length = 0;
7 d* n2 O3 X# i7 H0 D' Q
tbox.length = 0;
! A5 L, D2 t( a8 E
var c;
, x$ {9 A/ E8 A1 a- {7 k
for(c = 0; c < arrfbox.length; c++) {
1 Q1 s2 j6 y1 D3 T+ s; `" x: H8 U
var no = new option();
D. r6 w5 _; m8 P" v
no.value = arrlookup[arrfbox[c]];
6 l) I9 d$ u5 \8 C- c* m
no.text = arrfbox[c];
1 b6 |2 S& c+ ~+ B) D1 M R
fbox[c] = no;
9 J; C6 \. r9 C
}
# w4 [( a: a" V! p
for(c = 0; c < arrtbox.length; c++) {
0 | B: b, d5 U% z
var no = new option();
+ q5 O. I2 R0 _
no.value = arrlookup[arrtbox[c]];
4 X* Z2 S2 N& b T u6 |6 |+ c! V6 z
no.text = arrtbox[c];
3 C A0 S8 d _( q% X, g7 I
tbox[c] = no;
1 ], I( w6 A6 z! ? O+ Z+ z+ V
}
' m1 Y! Q* Z- w# @3 C
}
& Z7 i& v1 a% h* P5 ~' K- R
</script>
) h/ k4 [6 s- I0 A* Y
</body>
# H% C# w; y, p) Q9 ~
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
