标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
# o3 W- |/ ^& N0 ?$ K! Z5 d' ?
c pageencoding="gb2312"
' y9 w2 g" B& r; i3 s5 L. s+ g" w
%>
5 R, H! d6 v# K& N: @
<style>
+ L5 r" h9 P$ [5 M9 ]8 @! B
.f9{ font-size:9pt; }
' W& U b- ]4 H8 A
.bgc{ background-color:#aecaf9; color: #0033ff }
) F, Z# E: y( \+ T/ O9 ~+ h
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
6 Q T' ]" n; ]& h3 K6 s- O* N
border-bottom: solid 1px #4e7dc1;
& @1 l) M6 ?) K7 v1 g. z
border-left: solid 1px #aecaf9;
+ B" R4 l9 ^' q
border-right: solid 1px #5679bd;
5 b) C4 N3 [4 N$ y
padding:1px;
3 m+ T5 N3 L3 r( I9 X+ Z
margin:0px;}
$ B) H/ D6 ~ ~6 a
</style>
1 E5 `$ D' C- ~0 h% {5 y
<script language="javascript">
/ g9 i6 U; z" Y. r. E6 E% O
<!--
/ H2 r( y3 l. @( S3 _, b
function rv()
. e5 J0 m q: v* E) s
{
# _* M7 w1 r8 E8 Q, z, B
var val="";
' j5 X% A( h* W3 N- s6 p3 d
for(i=0;i<combo_box.list2.length;i++){
& {, S, H% G7 [$ A7 l
val+=","+combo_box.list2
.value;
% f* _3 v/ b: z" h V* J4 [) R
}
; l8 L" r& s3 [0 z, m
if(val.charat(0)==","){
7 i6 C, p! b5 d3 j0 s
val=val.substr(1,val.length);
) a' S, \2 k, i) }% Z
}
, `9 G Z- n& L4 k
opener.form1.frecname.value=val;
" h$ ^4 j5 O6 Z( F6 x* @
self.close();
, c) E9 G/ i! V) F2 \
}
; E2 h5 V3 Y @: F* c8 t$ F
//-->
. C+ f- T; @& B2 f3 o9 ]' Z
</script>
% n! l5 a6 D& g0 J/ C& y# B
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
8 X- O. S& l# w5 n. s9 k
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
& m3 T4 V: Y( x
<%
" l8 z' l7 U @5 C! Z# b9 p
cdatasource ds=new cdatasource(); //数据联结bean实例
4 @4 {. h3 r- K7 Y" e0 p
java.sql.connection conn=ds.getconnection();
" L! r ]7 F1 k4 @2 k M
java.sql.statement stmt=null;
6 `5 p7 R7 t7 E& E
java.sql.resultset rs=null;
' [8 m* c" E( ~' C6 x" K
cdatacheck dc=new cdatacheck();
* ^' Y' l$ F6 V
%>
1 \5 `. m+ h6 [, _6 i7 J2 `
<%
, B" u3 }$ u1 r; ] U
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";
' L2 B8 ?! Q: x+ i5 Y- _5 t" m
stmt=conn.createstatement();
, q9 l4 Q i0 r) z6 g2 Q
rs=stmt.executequery(sqlu);
4 d* ?- s7 X" f) C3 F, {
%>
' g. ~" i5 Q' B% }5 s
<script language='javascript'>
: w: L( U( g2 v* B5 f @
arr = new array();
# D3 z5 @0 a1 f; \8 B3 w
<% int temp=0;
6 e! R: [ Z8 ` e% w3 }
while(rs.next())
0 Q1 Q; Q# {. {1 d$ W1 m! ] y
{
8 E; V+ h; E' Z( ]/ t0 g4 P
%>
; w5 @, t2 j# N7 U; D! U+ }7 R; X
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
! q9 X) D1 s: j6 j& v$ x
<%
C5 b: Q* j- S' a9 `1 A
temp = temp + 1;
l8 q5 b9 c! ]9 V4 a8 a& M& T* x
}
T% S6 [5 }2 G5 Y2 p
%>
& I! B6 D+ i6 l1 C
temp=<%=temp%>;
2 y7 |; R5 i" o$ E1 s1 ~$ u
function changelocation(id){
$ b- ^! {! z3 _9 _
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
+ [3 r4 A8 L6 f- e/ `# c
var i = 0;
) u, ~" k. f5 d$ K$ G
document.combo_box.city.options[0]=new option('-------','');
% s" F+ Q9 h& r# J3 m; ~6 S
for(i=0;i<temp;i++){
: B3 @) Z! M+ w& o1 T; H# N
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
0 F4 d3 |/ k5 z6 ]7 `% u
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
7 F( F' s* @; g I
}
2 }+ x$ Q( y6 K1 b# l
}
! _" a" ? x) {' ~8 _9 T
}
% y1 L1 N1 a2 {9 R
</script>
" G4 u; x4 c& t1 b$ H, j" y
' b* g6 W4 f" I: W2 j9 w+ p
<form name="combo_box">
3 i' E! K# R4 x" @& B9 X% Y' a+ Y1 R
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
7 z7 e+ V) k4 Q9 D& G
<tr height="24">
- m) _0 f+ ?9 d0 s, T4 ^
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
; I$ U. f$ `5 ~$ C$ }
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
3 _* \$ M8 u3 j% ]1 {6 @# ?
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
]1 m' _0 `, _" p3 K. Y8 a
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
0 v9 S: M$ q: Q0 N; u% U6 x
</tr>
# m. C+ z7 f3 L* X* X( g: @
<tr>
/ r" k! Q% b; A0 h/ V( {
<td>
7 U6 ?* Z" j4 p, B) L
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
- z* J* k* |1 \4 `; A0 _
<option value="0">请选择部门 ---></option>
* k# D4 ^: y- C6 E
<%
$ L( z6 P6 T5 n% A
string sqld="select * from tdept";
6 m, }5 O& M$ d U! ~- o }
stmt=conn.createstatement();
2 W& j7 W) P( R& b' L+ L
rs=stmt.executequery(sqld);
7 z6 Q& h' Q7 D; C( }
while(rs.next())
- e6 ^+ w( H1 r1 j6 r) S- _
{
# l3 @! x) {+ b
%>
% L$ w& J+ S) B* o0 w
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
3 R& A3 ]2 L# a/ c
<%
: j- t( P7 _% u- l' B& E( h
}
, H# Q2 F/ G; f: T& `4 q
%>
/ h }, T4 j8 K7 M. {
</select>
9 E$ e i! F% l
</td>
: h' b$ h) y) Z# m9 _" C
<td>
[% j/ j' O+ M4 L$ U O
<select multiple id=city style="width:150;height:200" class="bgc">
8 R8 M9 S1 h% {* _# o1 h
</select>
# i/ _2 O" u- Q3 _7 `( P
</td>
% N; l1 m# r4 i: T5 V
<td nowrap align="center" class="bgc">
0 [4 v E& r: C
<input type="button" value="<<" class="buttons">
/ [- M- w6 x( y) U% _ Q
<input type="button" value=">>" class="buttons">
$ t. M" N. X4 {8 ?4 s( T8 r
</td>
# ~. D7 D- l9 |# D5 B1 \
<td>
1 |, ^) }- f; e+ h8 H) R0 q
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
- N$ k. a- `" |* ^; p$ j
</select>
$ J' W) b- ^; |! x
</td>
+ F: E) e! I: a H9 L
</tr>
) K$ L: [% B$ ~, r B
<tr class="bgc">
6 A5 M# V' K4 e& P$ r
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
) c2 I' k0 v9 c/ S6 O
</tr>
- W2 n1 b$ l2 Z5 z" A0 c
</table>
, K" z( g" v1 U4 H
</form>
0 g# k, W0 k1 v# l
<script language="javascript">
- ]" b C! T3 \$ }" l) p8 s
//人名移动
& }. ^& S$ P7 L: ~$ c& E7 a8 j; S
function move(fbox, tbox) {
& Q: |. r6 C; H8 Z, u) ]
var arrfbox = new array();
! M, S8 f, [9 ~/ u2 G
var arrtbox = new array();
: D3 |3 x. ]: S( [1 f! R( W0 o
var arrlookup = new array();
. Y( x+ k. s/ ?* B$ w
var i;
9 K* {4 z; e7 b8 B& D
for (i = 0; i < tbox.options.length; i++) {
1 `1 q6 u# g: [8 _
arrlookup[tbox.options
.text] = tbox.options
.value;
n e3 F8 _6 A; e
arrtbox
= tbox.options
.text;
5 ^! ^4 S( E4 b
}
& u- o! X1 W& ?4 J, w V
var flength = 0;
y# [& ~0 j* m8 Y. E/ X
var tlength = arrtbox.length;
% W0 Y' A8 w4 v+ p/ v
for(i = 0; i < fbox.options.length; i++) {
; ^0 G' _3 ?8 N& B v
arrlookup[fbox.options
.text] = fbox.options
.value;
% `5 l8 g: p7 I/ Z' W
if (fbox.options
.selected && fbox.options
.value != "") {
$ O1 |2 Z* y4 Q9 a0 C% i+ Q
arrtbox[tlength] = fbox.options
.text;
0 Y1 x0 N' y& i# P. J) Z
tlength++;
% V5 f* A. j# ^- w5 U
}
/ ^4 B. T* \: k+ ?
else {
/ H1 O* t$ g9 t7 q3 |
arrfbox[flength] = fbox.options
.text;
, ?/ t& p; a" V" \) Z8 z
flength++;
' Z9 |+ {, t& u" J6 s* O& E
}
* O$ X( L( K) G) X
}
& d* |: \1 l* F. f
arrfbox.sort();
8 n+ \! x# F5 `( j$ T4 V
arrtbox.sort();
, q) o4 O, e4 j) P+ J
7 X7 q( Q; w% b7 Q- u) ^) a% r4 S
fbox.length = 0;
8 V3 B* W. W# T% Z! i1 u
tbox.length = 0;
5 |5 @" i E) w2 ]$ ~) t) q' Q
var c;
: T- D6 [/ ^- D2 b7 N
for(c = 0; c < arrfbox.length; c++) {
5 U5 M3 o/ P* b1 O
var no = new option();
, ]- N# H' q" t, I2 U% g0 s
no.value = arrlookup[arrfbox[c]];
) R. p+ N7 u% P# v: g+ X% C1 M. M
no.text = arrfbox[c];
0 O: N$ v0 ~, T6 a% a3 M
fbox[c] = no;
- n# Y8 S# v2 d; {% O8 i
}
0 t) e% `7 U+ s( Q0 l4 I
for(c = 0; c < arrtbox.length; c++) {
$ v& V; [% i6 O. @% h# `5 q
var no = new option();
^+ p/ |% f& D* k; X0 V
no.value = arrlookup[arrtbox[c]];
# [2 N3 ~/ }! g3 A' S& I
no.text = arrtbox[c];
* \* _* w/ q0 u, Y% G
tbox[c] = no;
4 t6 [# u9 K2 j$ m4 N4 v
}
+ P" ?# O; t' O5 S: W* K
}
0 o# X+ _2 `" _% C ]+ b
</script>
& B1 x7 q/ r1 J2 A2 B
</body>
w) W5 @/ g; p4 J
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
