标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
v& z9 u' F, u M3 u7 b3 s
c pageencoding="gb2312"
' ^8 F6 C2 I" j; }5 ?+ h
%>
- q$ q: }0 m; j9 J0 T+ G$ ~
<style>
# ? T0 z, C A( {, N4 M0 k. d/ W+ s* d
.f9{ font-size:9pt; }
7 i4 I2 q8 @! e; P$ Y( T
.bgc{ background-color:#aecaf9; color: #0033ff }
& s7 ^- u b6 e# A( u7 ~" V; Y* x
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
7 h1 k* ^, h6 m7 a4 ~- x
border-bottom: solid 1px #4e7dc1;
. g! g2 ?& Z$ ]! d5 E( B4 A
border-left: solid 1px #aecaf9;
( E0 u5 h e# c8 t1 J2 g
border-right: solid 1px #5679bd;
' b3 `- W% W/ n5 R$ X
padding:1px;
5 {! ^7 M. D+ y' F
margin:0px;}
% B7 z; E( ?( d; C+ y9 p8 e9 Z
</style>
6 S2 A. p/ {: _0 Y: _) b# t( n
<script language="javascript">
- Z+ A6 r: A- M% m. V' Z8 @$ w, `
<!--
$ N0 Y; O* r Q- L |
function rv()
% [5 G- t& A" C1 f- s8 M/ A: N
{
& G( c2 \/ {1 Y! A+ d% }: A
var val="";
" ]; M1 u5 e" X& O7 M+ K
for(i=0;i<combo_box.list2.length;i++){
; c3 G2 Q+ d% p$ ~" p% l
val+=","+combo_box.list2
.value;
* V* ~, p$ z! n# x% J+ Q
}
A5 F$ `3 @! D: B! k' D2 I$ B- D
if(val.charat(0)==","){
& e, Y# a# I* d& B/ _) i/ h ?
val=val.substr(1,val.length);
& ] Z1 p! u- g% E- z1 S L
}
3 t! [# R8 G8 ~1 @+ W3 O1 \( V
opener.form1.frecname.value=val;
6 i- Z! ?1 B5 [7 R+ s |0 L
self.close();
: _) U% i1 J/ [5 ?
}
4 M- w" b# s' X; L+ T# @, {, k3 x
//-->
, p1 Z( E# ^3 s7 ]
</script>
' Z# k/ @4 T- M& a1 G; r. j
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
5 }8 r' i$ L6 S8 _* C
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! u! T2 M9 w$ ~# h `2 B4 U
<%
) i- N0 X0 @7 b( J. m0 n
cdatasource ds=new cdatasource(); //数据联结bean实例
# W9 Z7 s1 d0 p$ w9 i
java.sql.connection conn=ds.getconnection();
: t& n. c! Z5 V& X+ Y; e* x
java.sql.statement stmt=null;
/ ?3 L0 B$ S @/ s8 [
java.sql.resultset rs=null;
% O d: m% `. w2 m% S/ c) \
cdatacheck dc=new cdatacheck();
7 n& U# G' B: {) D- @
%>
* W8 Z9 ~ z6 B% V: `8 e) o Y3 f' n
<%
- d1 _% O. u5 P5 \
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";
$ |8 N% [" Y7 l( m( Q% Z
stmt=conn.createstatement();
% V1 o; Z* s1 |
rs=stmt.executequery(sqlu);
3 S* ?2 E2 q( @9 c4 v! s& i+ A+ S
%>
" a" ]& j' o) @$ `' C5 c
<script language='javascript'>
, \5 a U7 @7 A- w# k$ y- x
arr = new array();
/ E" ^6 a7 s- J! k$ W: C6 B
<% int temp=0;
/ w/ Y5 p- }( r$ j( v6 Y
while(rs.next())
, s) j0 j0 u, b0 Y/ `/ u
{
. N; m9 {/ {! Z7 j3 p4 }/ T6 D* L5 b
%>
6 d/ D# j, ]+ d$ b) }2 L) v
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
: S* n O5 }( R5 s
<%
* }3 |- \) Z5 Z. y0 J
temp = temp + 1;
: N' N7 r& E' {& |0 F1 l+ b
}
$ P! C4 w& w) @
%>
3 o2 f/ E1 H* P z8 e
temp=<%=temp%>;
8 d3 @6 n: {, U6 h; e3 h- @1 S
function changelocation(id){
]! P* B7 }8 F [4 s- O+ M0 H2 m
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
) Q4 r# m9 o6 l. [
var i = 0;
( x; J9 G8 f" T' {8 O8 Q
document.combo_box.city.options[0]=new option('-------','');
" i+ t& A8 ?8 s2 I3 |! o4 Y: J
for(i=0;i<temp;i++){
( y! H0 \. V/ s/ S( k6 O* {
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
8 D/ ?- |- c" v+ G9 T Z
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
( t7 j) C- p7 |; B) }* q
}
1 c6 @/ A' V+ i7 J. I! t! c8 o! V3 P
}
6 D Y5 Z0 A5 g& ^
}
5 ~5 F/ a7 M8 z& t8 I1 Q( S. W
</script>
9 b0 I% A6 L6 I0 r' J2 g
5 ~/ Q# Z+ {- R$ Q4 p! M
<form name="combo_box">
6 s. q9 q& I1 ?; s; H
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
$ o; k( g1 Y, Q* H
<tr height="24">
3 w2 ~$ S: o! {; T
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
+ F S x) ?1 G; {( Z8 g
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
1 I# @7 H0 w8 @6 X' n+ n% v
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
7 o/ K W _( Y8 q j0 `
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
' B/ r! |% I* V, e& m
</tr>
1 G G$ L, x1 |1 T) g. ^* P3 q+ G
<tr>
: S9 I- D j; s% T& W( S" Z8 S
<td>
. ~- U( K2 f; o( g$ O' ^
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
* `, _' k$ _% U- [
<option value="0">请选择部门 ---></option>
9 y: @# w0 D; W) F) w+ U$ H' P
<%
# b, q& f" `8 F4 C' V
string sqld="select * from tdept";
7 Z% y: R* K& ^& Q! f1 o& s1 f+ Z
stmt=conn.createstatement();
2 K S) G' G3 B. Z d$ j% Q
rs=stmt.executequery(sqld);
& W( M3 [- ?& p/ p0 d
while(rs.next())
) o$ n1 L8 B0 Y3 Y& R# J& _
{
8 V; ^4 \# E4 Y2 e! v* ?' p8 ~
%>
& \7 z0 e3 t* Q4 d: [; ]: x
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
, D6 S) |+ {+ t& x/ Q- W% W
<%
8 b6 z; X% ^5 z- W& u( {
}
0 U; W. k' w* x8 i4 V
%>
* V7 V0 O+ k# Q2 ^8 D% W9 X
</select>
- H, b+ O: N) H
</td>
2 Q8 k" M" |. _# {2 l
<td>
- F2 G8 I$ U" g
<select multiple id=city style="width:150;height:200" class="bgc">
0 S0 i8 O, ?8 O; W; e
</select>
# q" f4 ?1 }. m( E2 I6 s* k
</td>
( Y2 R0 l9 n' c
<td nowrap align="center" class="bgc">
+ |1 b- a" y/ `0 x3 a8 M
<input type="button" value="<<" class="buttons">
6 y- v- {. M8 R8 m+ w
<input type="button" value=">>" class="buttons">
$ e0 j& w* V9 Y! z- @- ?' Z
</td>
5 o5 c9 S: d! W
<td>
+ H6 r7 W! I0 s5 I
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
% c- i4 D) \. Y2 j0 S, i" l
</select>
+ |! \/ x* E, N' a% r5 x
</td>
" w) W/ n- C* r' ?0 g
</tr>
% i" f+ d- g5 K8 {! Q
<tr class="bgc">
6 C% L. t K/ n+ p6 D# \- q
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
- R1 y$ P$ b7 R+ n) ]
</tr>
- Q# P) J/ ?8 V6 A- G9 z
</table>
. Z0 o7 I7 t$ ~
</form>
6 B4 L4 g `$ ?( r/ h
<script language="javascript">
; m2 \9 X9 [# S# b* z; s# D8 {/ _
//人名移动
; `, q6 y7 x0 q7 R" Z# A
function move(fbox, tbox) {
5 _% a7 E3 z6 L2 s- Z+ n
var arrfbox = new array();
2 y- Y1 [. H/ ?- h
var arrtbox = new array();
) L& M- y% \' b
var arrlookup = new array();
+ ?, X1 e$ |- X3 X+ I
var i;
7 {& I- J6 \3 D
for (i = 0; i < tbox.options.length; i++) {
( l) w- u& e/ z! H9 V
arrlookup[tbox.options
.text] = tbox.options
.value;
! @2 E; ^! w8 L4 ]6 n7 X: i/ d, B
arrtbox
= tbox.options
.text;
* D; V( J) k. |) ^& y
}
4 {. N w) X$ l) R, m$ h
var flength = 0;
- t/ D3 T% u& L: o2 Z
var tlength = arrtbox.length;
1 L; B9 e( ^8 A/ I3 ^
for(i = 0; i < fbox.options.length; i++) {
: I6 d% b2 [! ?
arrlookup[fbox.options
.text] = fbox.options
.value;
E8 q$ U1 o/ h: E* I1 ]6 t I% c7 X
if (fbox.options
.selected && fbox.options
.value != "") {
$ D8 w6 g; R8 ^# O8 Z6 Q
arrtbox[tlength] = fbox.options
.text;
6 v4 \& _+ e; x$ a
tlength++;
' E1 M! X6 ~7 ^; O( p
}
7 y" m5 `3 P# }# s# C
else {
# u( U3 e& W/ h- m/ X
arrfbox[flength] = fbox.options
.text;
& B6 m7 s, Z* F* f2 q9 r) s7 d$ I
flength++;
$ m# X$ _/ }3 |* l8 g- ]% |+ }$ \
}
q" D" d1 z- i( C0 X. ` N# P& ?
}
+ S W0 p% g6 r$ B+ U4 ]1 B
arrfbox.sort();
1 M: o* z! L2 X2 H$ d
arrtbox.sort();
) E# E/ r9 l6 c5 H( i$ u7 E* q/ A/ I
% W8 s$ n7 R8 w$ T9 X! e
fbox.length = 0;
4 X" O+ D# P8 e
tbox.length = 0;
) W3 j6 [7 R# L3 G f z- y
var c;
9 `. _9 q% j l% Y6 s4 |
for(c = 0; c < arrfbox.length; c++) {
5 n4 C7 g, c3 `! {
var no = new option();
" m" a. m; c& C5 {
no.value = arrlookup[arrfbox[c]];
9 e. T* V5 v+ A- L) N6 `1 ?6 s
no.text = arrfbox[c];
* F; r/ w8 e8 U
fbox[c] = no;
$ y P" e e8 m7 |( n1 Y/ U
}
# F9 d; E- h6 a1 o( k" k
for(c = 0; c < arrtbox.length; c++) {
8 A% h s/ \! L2 K
var no = new option();
5 s* D, }0 ~' q& O9 d
no.value = arrlookup[arrtbox[c]];
& A* N, O5 L# M. Q
no.text = arrtbox[c];
" N" V$ C9 V {% R& w& v
tbox[c] = no;
( B/ _7 O+ L- q U+ ^% S6 ]
}
$ a) I* z' T, x5 {: |0 X! A" w
}
8 Y0 w7 @. P, C7 S2 F
</script>
$ ^9 S# }. Q* {
</body>
" n: T6 B0 b* t% q+ e" }0 Y' E* h
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
