标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
7 x9 M/ t6 _! D2 o- k% s; B
c pageencoding="gb2312"
' P+ H0 E5 N* z3 x, \, j# @- g
%>
% k5 U5 r1 ~. f; D
<style>
8 ~# ^, M$ U* j; m2 Y+ E4 u6 r
.f9{ font-size:9pt; }
8 L% Z+ c) T* S
.bgc{ background-color:#aecaf9; color: #0033ff }
5 f* }( v$ F, [) \; K! W+ I2 g
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
) o- q! U- Z, I7 Z) a
border-bottom: solid 1px #4e7dc1;
# D" S! j) t6 L6 R' M
border-left: solid 1px #aecaf9;
0 G4 j/ S h# D$ y; o* |5 a' Y6 d
border-right: solid 1px #5679bd;
9 r% }8 I1 |' v9 l" A
padding:1px;
$ N7 Y1 }# w: ]; y" C6 w$ h
margin:0px;}
4 e& H y$ [3 I7 \
</style>
7 i. E, c* x; S+ X; s# d
<script language="javascript">
2 z) q/ F/ D& \( c
<!--
2 G$ I0 Y" `6 z6 p+ @+ j
function rv()
. ]9 d3 ~7 p. [: {( B3 r
{
& y/ T( U l; u( B Z0 K/ M" H( q' q
var val="";
: q" c7 @ n2 A) N/ L6 R* G0 J- P
for(i=0;i<combo_box.list2.length;i++){
, O. I4 T) C- O4 v+ d
val+=","+combo_box.list2
.value;
' K8 a/ p1 y! A# U
}
! S4 Q7 T) ~# n! t' W0 _2 Y
if(val.charat(0)==","){
9 {' p" Q* `+ S: a/ \7 M
val=val.substr(1,val.length);
, o" B: s) B8 A% t. U
}
7 s8 ~9 m- e: W
opener.form1.frecname.value=val;
" _! R! l& e2 n; j
self.close();
1 r& Z9 r/ L# P9 M- ]
}
1 l& z, n$ v: ?/ R
//-->
2 ]5 o! J) N$ Q+ j) n9 m
</script>
$ P4 S) a. ^% n& I, o
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
3 M8 f: K; x5 N
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
% |! {+ w7 V$ i" k3 V1 m
<%
1 U c4 {: A* \ q, j, ^
cdatasource ds=new cdatasource(); //数据联结bean实例
5 V6 P# [+ K, E$ p, {
java.sql.connection conn=ds.getconnection();
, L! ~) Y2 W# Q* M/ |* M3 I4 p l J
java.sql.statement stmt=null;
7 n$ C6 D$ V; Q
java.sql.resultset rs=null;
6 ?, ?0 O6 _% r3 c, O$ @0 m0 ^6 v, y% \
cdatacheck dc=new cdatacheck();
' x5 H) T; c; r( O* ], W
%>
5 H8 E) [6 D6 J# U
<%
5 |. I% W* f9 E5 r: T: p1 K
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";
1 D* U7 M/ C" ?
stmt=conn.createstatement();
5 e6 N$ N2 A2 @ i
rs=stmt.executequery(sqlu);
Z) v, Q7 \$ n* O" O$ j
%>
/ [" F; m t" ]3 I/ q
<script language='javascript'>
4 b' b% ~+ V: S0 `
arr = new array();
/ [ G/ x$ R2 \1 k
<% int temp=0;
. s& b" A5 v# G$ h" ~" J- u, s
while(rs.next())
8 D4 {/ o% y& B0 i. p2 o7 V% S
{
: G; s( e( v9 j. h
%>
: G, F/ z- j; M- P3 w- x
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
r6 [0 @$ `6 S; Y8 u! l
<%
- L" v' P/ U. c0 A
temp = temp + 1;
I; N& w* Z" N& m" H9 L* B
}
, S& L% Z8 ?1 ?/ m# d
%>
7 M- c1 D# w9 L1 n
temp=<%=temp%>;
! d ?/ N L/ G* E
function changelocation(id){
' }; I$ U7 P; n5 Z
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
: Q" X$ Q+ G }+ W$ B7 {. Z# D
var i = 0;
$ J/ x3 L3 w* A5 [+ @6 K# E
document.combo_box.city.options[0]=new option('-------','');
6 ?6 q2 r* f {6 J6 o8 {" ]0 U
for(i=0;i<temp;i++){
, r2 E4 p3 `4 g6 o; S# g- d0 ?, z
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
) I! o+ V h$ D
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
" v9 y7 s: Q, h1 ~+ Y5 r
}
. V$ K! V8 o' M1 a3 q/ Z5 W# d) k
}
& R* D: x1 l( G( B( Z$ f
}
# {# h) r: H. L
</script>
! l, Z4 v0 }" J" S+ M
- z# l: K ?/ ~' [8 W
<form name="combo_box">
. n3 ?0 X) r" R$ k% `+ W: V D
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
4 A+ p @4 X7 S3 I( F3 @
<tr height="24">
6 b8 ?+ I2 N- j7 y" V- i1 j" g
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
; \6 w9 I9 r8 t
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
+ s$ E7 A% W: o! Y, D
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
7 a$ z. @1 h% x
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
% g! _4 J4 `: z! E( }
</tr>
: ]+ d" D2 L1 ]; Y7 x' _( O$ g6 `
<tr>
1 X& D$ J$ t! D+ i1 p1 }/ q! R
<td>
" S& p1 s1 Y M. N: |# @* H
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
. Z3 [2 t& _1 T- m% m
<option value="0">请选择部门 ---></option>
8 l4 M3 w( V, n
<%
3 O, h+ r* f# z
string sqld="select * from tdept";
* ~" n, n+ u% g6 K
stmt=conn.createstatement();
% v# W$ Z" C. A3 | S
rs=stmt.executequery(sqld);
$ w3 q& h& p( _( m) l% A$ x
while(rs.next())
6 j! p1 w* z' H# ?9 Z: |
{
- U& j) i0 G) ] F6 w" Q
%>
0 w W3 J7 b0 D8 G
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
6 ?1 s" s/ P, r( ~
<%
2 k1 O! q6 M2 A9 @) G
}
9 C3 }) T6 A9 @8 r
%>
! T& \' t8 Y( n5 _- }7 l: o% Z
</select>
! p# F; j9 I- w' B C v
</td>
" k9 ]4 S$ J* D5 a& Y1 ^5 K
<td>
: L" \8 i) y* d& b5 s
<select multiple id=city style="width:150;height:200" class="bgc">
) U& s& q- D8 D$ l* n
</select>
5 y0 h" L! y' P
</td>
3 o" s b+ |% i, k/ `! p1 y+ b( e
<td nowrap align="center" class="bgc">
: F& z( E. h/ q* o/ j4 H. t8 ^
<input type="button" value="<<" class="buttons">
, d% v4 p) g$ w- A! I
<input type="button" value=">>" class="buttons">
+ x' f6 c V. c8 F% @0 F$ }2 U
</td>
$ A z0 {4 y! w' f# p/ B
<td>
$ J- v. ?/ M7 Y) j4 C' z& n0 X
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
- } T6 @, x$ V# t2 N8 z! k5 r2 h, Y
</select>
4 X* V1 d* I/ k, s2 C
</td>
! C$ ~4 L8 [7 `+ K- u( I" G
</tr>
' x" d( }) R5 i% l! Y
<tr class="bgc">
' }2 R7 z- w$ ?0 V
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
% |5 |+ Y {8 l7 `1 L" t( V
</tr>
3 w8 q# G1 y* e1 A
</table>
; y" g9 ?% N. f& d$ \" e9 I
</form>
^/ \4 B7 ?8 Z0 I1 \& t
<script language="javascript">
! `! Y/ }6 D- {
//人名移动
% d/ {3 I( _3 A: Q1 m) E
function move(fbox, tbox) {
& h5 x' P: E: q5 z- z) U
var arrfbox = new array();
0 U: {% O1 ~/ J
var arrtbox = new array();
: K3 d# u5 @2 R" ^
var arrlookup = new array();
" q }+ n2 X4 y0 E9 o' S
var i;
% D' I" h% J6 e/ O
for (i = 0; i < tbox.options.length; i++) {
, Q7 q$ u8 T7 @6 ?3 A# m: `
arrlookup[tbox.options
.text] = tbox.options
.value;
7 \ t0 W/ o v2 M0 A) }
arrtbox
= tbox.options
.text;
6 h, c- _- x3 a' o' F. g
}
2 H9 c. K' _; z. p
var flength = 0;
9 U$ Z* p8 v9 A) H: f3 t- [
var tlength = arrtbox.length;
/ U/ W, u- K9 c, x" @( B
for(i = 0; i < fbox.options.length; i++) {
$ d/ s, L1 d6 m
arrlookup[fbox.options
.text] = fbox.options
.value;
- I& i" e8 O- c# J) P
if (fbox.options
.selected && fbox.options
.value != "") {
8 ~; X( @& S+ p
arrtbox[tlength] = fbox.options
.text;
4 c8 m5 v# M! t% z3 v- G
tlength++;
5 A) T2 V* m/ N: @$ I4 r* v
}
3 e$ \' z2 T, y3 _$ l
else {
' m$ d9 l B" N9 S0 ]9 v/ }0 j% Q! j3 v
arrfbox[flength] = fbox.options
.text;
/ Y7 z7 v/ x! [, a" |
flength++;
6 r- o) k( E! e- P) ?
}
' F% y# G0 l' [" Z7 |3 L- U
}
5 j5 j0 g9 Z9 `% Q. F
arrfbox.sort();
4 f- a, R2 ?; ]8 ]
arrtbox.sort();
# R( O: U7 x) q
4 V9 N/ h: e; H( x p$ O
fbox.length = 0;
& c& {* S3 P# t: }! F2 C5 [1 s4 W
tbox.length = 0;
J6 F: H6 P' l: C( e6 G; l
var c;
3 a# P4 n7 h6 D! i' p# C
for(c = 0; c < arrfbox.length; c++) {
9 r* j% K. M9 O. P
var no = new option();
B, |& z. z# ]' a7 p
no.value = arrlookup[arrfbox[c]];
% W* c/ W! a7 k7 f
no.text = arrfbox[c];
" L6 x1 p9 R4 e% `5 H1 ^; Q3 Z
fbox[c] = no;
; @# B! l5 d8 I. o9 A. e& f% E: G
}
% H. m8 n' R; C7 s6 \
for(c = 0; c < arrtbox.length; c++) {
0 X5 P, Y, `4 I
var no = new option();
$ b1 L' y( b6 T- f7 \" _
no.value = arrlookup[arrtbox[c]];
8 n) E% D/ J1 G; W5 \9 [4 e
no.text = arrtbox[c];
4 m; C: i R9 i1 t1 B; C$ O& k
tbox[c] = no;
! A0 {5 C* W8 Y% B& G3 c7 h8 U
}
% R8 Q6 z# b$ G, f* I5 a. V: ]# W/ ]
}
/ d4 H8 ~7 L q6 p6 n" v
</script>
B8 ~. Q* d$ @! x+ \$ A; C9 p
</body>
& ~/ {$ m6 k/ S* K
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
