标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
+ a H: T4 P, b* L" y
c pageencoding="gb2312"
) v) y2 v) K# H
%>
' E% Z& `! Z! I( |) r
<style>
- q* M- q9 L1 I: y3 W- i+ C
.f9{ font-size:9pt; }
/ }0 m P, t; A: F& u$ d
.bgc{ background-color:#aecaf9; color: #0033ff }
- Y4 l; D9 |, t m; U: B
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
' N% D* v% \! m- d) Y- H: M
border-bottom: solid 1px #4e7dc1;
2 E M d+ G, Z/ q) z, l! ^
border-left: solid 1px #aecaf9;
$ U$ s. N; [1 a! ?
border-right: solid 1px #5679bd;
! g! F/ P8 x( Z/ u
padding:1px;
/ p4 D5 J0 T+ p5 |) j9 E8 s
margin:0px;}
) O0 `6 {9 \0 z) u
</style>
8 n3 E* C$ [2 t6 p. s1 G
<script language="javascript">
5 y8 a4 G, g8 C% W
<!--
- U+ R0 H \" R: u" _
function rv()
0 @5 A& l$ W( u& E/ [- p: e
{
/ r! U4 B3 @7 U" N. V: ^
var val="";
; C! w3 j3 D0 l& Q( G
for(i=0;i<combo_box.list2.length;i++){
' k, j R$ \" {
val+=","+combo_box.list2
.value;
6 F4 e n& u) A
}
/ h+ s; m+ j7 j% O: ?
if(val.charat(0)==","){
5 N; { j7 S( x
val=val.substr(1,val.length);
7 L1 _+ M& z$ g" a+ d. X# F% s
}
7 b" c3 t( w# h+ h7 w
opener.form1.frecname.value=val;
& b3 }; l v8 J" T% b
self.close();
$ z# b& N; Y7 E9 d: |7 H
}
6 {& W/ `; ~4 W( r
//-->
* c1 F' X$ R6 b# U% N# J/ v# E
</script>
7 e0 j2 M0 I" m1 |! l
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
9 o+ U9 u, W9 G' D/ z
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! f) ~6 K- S( w
<%
# g8 T6 Q& h) b$ b1 V
cdatasource ds=new cdatasource(); //数据联结bean实例
: o0 E; r9 d' Q/ D' w# c
java.sql.connection conn=ds.getconnection();
6 i) P) d) B- S( ?# C. v
java.sql.statement stmt=null;
/ [7 d# p+ R4 N) P' B. f* x
java.sql.resultset rs=null;
, y3 W6 l9 i6 A/ d
cdatacheck dc=new cdatacheck();
0 r/ o' U* X! z* Z4 i, U
%>
; l* j+ q0 j, Y2 [# ?# h7 g& j
<%
# @& F1 B' o8 B' y2 P9 I; @
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";
* }# N) C. K# ~
stmt=conn.createstatement();
3 Y: }! n, [- R+ w
rs=stmt.executequery(sqlu);
! _, z7 q! o& R' s
%>
9 t `" G6 V1 y3 i# {
<script language='javascript'>
. I5 V8 n( t1 F; b
arr = new array();
A8 ] G0 |' e1 G) Z
<% int temp=0;
" w: l' J( M9 ?3 p6 a
while(rs.next())
4 W- G# G8 u: }9 J1 o+ I' @* o5 k
{
0 M6 U1 O& b ` ?3 X. [" A" t7 f
%>
% j+ ^7 [5 @+ p; c
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
! R6 c, @& S; c: B$ g# a% b! j
<%
6 M; D# i1 s O7 ~/ n n
temp = temp + 1;
0 o1 k& D1 {5 t& W" t5 _: f. A
}
: ^* m, }# v! N9 P! ^
%>
+ B9 W4 _0 y0 o; V, ~8 J
temp=<%=temp%>;
9 V( ]# ^! V: V; ~2 l6 I: }+ B5 U
function changelocation(id){
2 S) n" W7 f& \- a- r2 }: X4 d) F
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
5 I+ P7 _- J; x$ e7 H7 G1 z# t
var i = 0;
; F' J4 D( n: z3 F5 \3 t$ \
document.combo_box.city.options[0]=new option('-------','');
7 j" X4 w" l0 j7 c" f4 A
for(i=0;i<temp;i++){
4 C1 C- Y3 r9 H: O: S! j
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
7 y* j+ `$ e6 J* \6 \2 W0 [' S/ r
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
3 V L, A/ q+ j
}
$ v, q2 l/ ^- x7 C7 D3 x
}
8 s) X, Y$ u: I* `0 a0 a
}
8 A6 {0 |7 ]/ ?) O# }
</script>
% k8 X9 X4 C- \$ v
% h) I3 j3 O, y# {
<form name="combo_box">
- Y2 Q0 H4 O0 d; r9 u
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
4 \4 N4 h- V# I ?: j" v/ g
<tr height="24">
. I7 a6 G$ P! G2 w1 H. w% d) G2 L
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
( O6 R: `( M9 K
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
; o4 R- w5 q" {7 }/ j6 W
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
: L9 i& I$ k( z U |" E/ Y1 m( d
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
" |) l9 B1 Y9 l/ \: [# n
</tr>
' m' D' Y' L) k G! d
<tr>
# H( b# U, s9 E/ A5 y
<td>
1 K) B4 { w) [" I" u$ B; E
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
) X5 b+ ~$ Q5 \" @ j3 f5 M% h
<option value="0">请选择部门 ---></option>
6 T; G: w7 y5 A/ ]8 R# j9 f, _
<%
4 l- g+ q0 i! O u
string sqld="select * from tdept";
8 ^8 e; e' W) s# B3 q& e
stmt=conn.createstatement();
5 q1 N7 k9 Z# L
rs=stmt.executequery(sqld);
1 F8 S" p$ c3 c7 {& Y. P
while(rs.next())
% W7 v' w% |* u2 e+ S
{
* |' y3 d) T' g+ @
%>
5 ^* y" Z( J! D! t$ H9 ]
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
+ R* F( @" z# ~. v1 q+ G' P
<%
2 z# U* c% c4 ?2 b
}
$ j' g$ |6 _/ m0 y) u3 H6 \
%>
8 M& w3 s$ Z% d8 L8 d- D
</select>
. E. ~, }8 a. C
</td>
% m( w6 a" p7 N! F; s& R7 @5 l
<td>
% b! r' A/ k9 t9 v
<select multiple id=city style="width:150;height:200" class="bgc">
* w+ T( [- Q# R7 ]# c4 E
</select>
5 |8 w: e( H5 C0 I+ u
</td>
( s. }5 f5 J& V$ {3 G" G
<td nowrap align="center" class="bgc">
2 N9 q$ Z. J7 ?- b, f: K. L
<input type="button" value="<<" class="buttons">
9 G7 W; r) X8 z8 [
<input type="button" value=">>" class="buttons">
& e; d( R& \7 W% t1 O" W9 M5 [
</td>
) W- Y$ w0 c7 C" W9 u; y
<td>
+ D7 L( L# Q, \3 Q2 U l) k# H
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
+ I q( w! F9 p
</select>
, ]5 ~* U' r6 N+ B2 ]. ^
</td>
# s0 [; I2 B4 n: J6 F' L6 U' D: T
</tr>
/ r3 O7 c+ v: V% N) d+ X
<tr class="bgc">
8 J1 e7 W) G9 G2 J' |
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
! @; _2 y. z( y4 k j! z
</tr>
5 e) r- `1 I/ J
</table>
2 x: E! e. z& b+ l
</form>
[( r3 e2 _% q% o& T1 x
<script language="javascript">
! i) a2 f; n1 m
//人名移动
8 g/ ]) k3 x+ B5 }. z( w4 J- R9 N
function move(fbox, tbox) {
- O# e' E7 r! u, F) v
var arrfbox = new array();
; P0 t! ~9 s( `
var arrtbox = new array();
8 a, {" _; Q/ S- A9 ~' o
var arrlookup = new array();
! f! w1 [. o# P, b0 C# S7 `; F( Q
var i;
9 R6 {' m6 r0 w& g
for (i = 0; i < tbox.options.length; i++) {
% i. \. o5 j1 N1 \5 R0 G
arrlookup[tbox.options
.text] = tbox.options
.value;
) x9 y3 {1 k3 Q# a4 t
arrtbox
= tbox.options
.text;
) t6 j6 O( F; _5 Q) E6 N; A
}
! B y! L8 m! f3 X, W; ~
var flength = 0;
9 x1 v5 T- W1 Y0 }/ G" S
var tlength = arrtbox.length;
3 J, K' w4 i% r! k" L+ D: ?
for(i = 0; i < fbox.options.length; i++) {
4 ~8 v4 v" C$ G5 P, I5 l3 I
arrlookup[fbox.options
.text] = fbox.options
.value;
* n. }1 [; }: f( H" L5 b
if (fbox.options
.selected && fbox.options
.value != "") {
" A" e: g V* {* T/ p
arrtbox[tlength] = fbox.options
.text;
- O! F9 }! U+ Q! Z+ e A7 z) {
tlength++;
; S" p9 U+ l9 `* h6 E
}
7 N9 A z# o" b# o5 x! |* O1 p
else {
6 n# `3 r, q. ?# ~8 Y
arrfbox[flength] = fbox.options
.text;
# }5 B, N! ~! q; Z
flength++;
0 ~5 M& a4 c0 c( M4 J5 {3 \
}
1 ^ J/ j6 z& Q7 s
}
- L; t6 C; C6 ^( D3 r& O
arrfbox.sort();
3 l9 m3 \4 u% C0 w5 K
arrtbox.sort();
& R+ M, u1 L7 G; @
! j$ S! A2 k, n _( ]* E6 W' x1 \
fbox.length = 0;
6 q$ F+ b7 b; G0 r# v2 _+ r. ~
tbox.length = 0;
% d, _# H* m$ q! a
var c;
1 ~# Z, p1 F- p# B. M. C
for(c = 0; c < arrfbox.length; c++) {
2 b" Q( z5 H8 e' \0 d2 x
var no = new option();
, x. L% A) R: {$ \; Z
no.value = arrlookup[arrfbox[c]];
! `; b, {9 e+ { J6 M
no.text = arrfbox[c];
3 A% W8 g0 G" E- g! F
fbox[c] = no;
- H/ ^( }/ L$ Q @
}
+ z: r/ S* Q1 B# c
for(c = 0; c < arrtbox.length; c++) {
4 @+ T7 k1 T$ n5 E
var no = new option();
" o: s( k& [* e' L7 Y9 K
no.value = arrlookup[arrtbox[c]];
9 n0 h! O9 W; H
no.text = arrtbox[c];
Z2 ~8 k- k& O: S3 {( L* H1 Q
tbox[c] = no;
% ~ H( e2 J; a6 u% w+ c7 I
}
7 n# E' C; O: M
}
4 x Z/ A$ N7 D8 X! ^2 q
</script>
+ m( M2 I$ X4 \0 r4 N
</body>
9 m- r1 D1 _- k! O; s; i
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
