标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
9 C+ e6 ~3 Q. y$ D, B
c pageencoding="gb2312"
1 z. k2 }. ^8 i7 _
%>
5 G1 o% X. ?4 a. U! _& r
<style>
, V) [0 `6 E. |$ d1 L
.f9{ font-size:9pt; }
) J3 x# c, t& t* G/ F/ i
.bgc{ background-color:#aecaf9; color: #0033ff }
. e K- w( v' I7 W$ u! v
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
m' V* n2 ^/ k0 ~' W
border-bottom: solid 1px #4e7dc1;
2 P2 k2 Z1 Z S+ q8 N
border-left: solid 1px #aecaf9;
0 B7 j5 b( C! Y* j3 X3 v- I2 W" J
border-right: solid 1px #5679bd;
# v, O. H) y) R& }) T% |" I3 R
padding:1px;
8 _, Y1 v# o% d0 T1 {7 ~) E
margin:0px;}
) D/ l: E0 F3 m
</style>
9 V2 F7 @2 ]8 h7 x
<script language="javascript">
[6 R: f; ^; a4 \, q8 l) ?
<!--
. v, ^; B0 e2 }8 O. H7 k
function rv()
! U1 ?- o+ n: G: f c+ P, ^4 C6 Y
{
5 t7 K2 L2 j3 l, G; y/ z
var val="";
$ s4 O9 a$ h) [' I
for(i=0;i<combo_box.list2.length;i++){
, F' b: ]9 |$ M$ d$ D
val+=","+combo_box.list2
.value;
* I) v$ x7 P) t+ `% U% V
}
. D3 D4 [2 m' x- A& B
if(val.charat(0)==","){
- ?, g! _! |8 r& K
val=val.substr(1,val.length);
6 S7 s9 g ^" Y% }3 V
}
# a8 a( ]2 b* ~8 F
opener.form1.frecname.value=val;
$ i" T4 }4 E0 a
self.close();
3 f# I% R' C5 N- o
}
& k) [' Y6 Z6 Y
//-->
+ l/ B& [! W6 N* i% ~' z2 I
</script>
0 e7 X- D* `0 D0 j. i3 e/ N
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
7 o ~$ N7 Z' o! w2 I1 m
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
0 e; m5 F* c' w& n) u
<%
3 g& h# e' I- q7 c3 b: X9 P" }
cdatasource ds=new cdatasource(); //数据联结bean实例
9 ~& u3 D4 H Q0 N1 i
java.sql.connection conn=ds.getconnection();
5 M: w; I, ~- f
java.sql.statement stmt=null;
( i3 a% X& K! G, U1 e5 t) ~
java.sql.resultset rs=null;
8 M9 V3 H5 V8 p1 c2 Y
cdatacheck dc=new cdatacheck();
! @+ S6 Z$ D& z1 [3 l. Z5 r" d1 j
%>
+ g& C0 D! q- f$ d- \
<%
$ j2 q5 d, ~3 J& Q7 ^$ R
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";
: y! O6 X E( i. |
stmt=conn.createstatement();
' \9 r9 Q- a' p/ `& a
rs=stmt.executequery(sqlu);
2 ?7 B/ t' t c: D
%>
% a* m ^6 {" A3 S3 M
<script language='javascript'>
. X# R8 W. U4 a: i6 q4 n
arr = new array();
7 E( {6 Q, P9 {. h
<% int temp=0;
" a; x& g2 c! ^) L B
while(rs.next())
1 u, k: e: S( H3 S+ ?: e3 N
{
4 f& T* {3 k' C; b# z9 A! M3 ?
%>
6 Q/ W1 o. F$ [7 a% e+ D) C3 U
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
/ q+ S- E( p% d. J2 V1 g' f
<%
( y% I2 b) S ~( I: I
temp = temp + 1;
M7 w$ Q0 ?, Q2 G! v* W
}
) ]* v+ b, T* h$ i E+ d2 c; q
%>
3 b; L, [7 [4 ]" ?
temp=<%=temp%>;
3 ? L& k# S# W( ?" F+ L4 c
function changelocation(id){
1 t( A% \; n5 `
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
: w# w- E/ x; ^4 i+ `- s( m8 @
var i = 0;
* d3 a- ~8 `6 v X$ A) `9 ?
document.combo_box.city.options[0]=new option('-------','');
, j+ M2 A0 Z( v" y
for(i=0;i<temp;i++){
( s! T* Y: @, ]( _3 P u" N- Y. O6 a
if(arr
[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
( c3 ?& @3 e7 t b5 R% U1 S
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
" s& V4 m! v$ ^; h+ |6 X5 D
}
% X. S- a, b1 O9 c3 G
}
1 g/ J) G+ {+ V# D( t9 g4 ]. X, Z
}
% C6 ^" W+ S" m
</script>
* m v. W* o/ L4 L
/ h( Y& {2 g7 I
<form name="combo_box">
" S: o+ W1 ]; y9 ^ X2 I
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
5 a. k# B0 I! Y
<tr height="24">
: S5 k9 @9 B& |) h9 u
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
+ h# t+ z r X* A
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
) ~# W6 ^2 f# n1 O7 S
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
7 M ]9 J( u( Y1 M" }& f6 c
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
0 r/ z! N M3 p8 X
</tr>
7 e& W Z. f0 p4 e0 q; l
<tr>
+ B: H- W9 ^4 B0 f
<td>
2 \! A; T3 @ S3 A/ |
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
7 h3 n# S3 D6 D' ?2 q* o& Z6 {
<option value="0">请选择部门 ---></option>
% _2 z' P+ U. \1 h; o1 M0 ~" n
<%
; M6 V6 K$ F. Y2 S; c6 k( K, q" t
string sqld="select * from tdept";
+ [0 m& v+ i& k* S) r
stmt=conn.createstatement();
* R6 ?/ j$ K" j. C$ C- l- z4 b3 |
rs=stmt.executequery(sqld);
' Z9 [8 [* v' p: t
while(rs.next())
* g0 }" I# n% L
{
* X& h/ G' E6 K f
%>
2 K0 q1 F, z7 j: X
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
# k; q, B; o6 Y4 E( O: i; K
<%
- x% y$ u, T( F$ ] Y& S
}
/ X, f3 z' ?9 Z, @
%>
: a8 v4 E+ M3 N F( H1 g
</select>
' }3 N o0 ] j+ j" J. w7 _: c, o# Z
</td>
9 T, S4 k; p8 o
<td>
; _1 T* k( U/ q5 K! e5 o
<select multiple id=city style="width:150;height:200" class="bgc">
' f8 W) N7 Z& o0 V) P( c
</select>
4 `# t7 O C. O5 P) U! G, j
</td>
2 }% W6 V" \7 H+ \' i0 _
<td nowrap align="center" class="bgc">
8 u3 |4 l% Q1 _. d/ o
<input type="button" value="<<" class="buttons">
- V7 r& W) a9 g3 b
<input type="button" value=">>" class="buttons">
b0 X6 N7 d" O5 V, b2 c" v
</td>
) g0 _$ w I" j% Q, F
<td>
3 H0 m. \/ x7 Y) ~2 W
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
$ V' q. D+ [2 j
</select>
4 |; X8 v `& x4 x) s/ z8 b. ~
</td>
4 ~# V Y2 Y5 y h9 ?; `' E
</tr>
4 k H8 }: A" \( g/ J* @) c
<tr class="bgc">
- g' i* M0 S# x1 f! v3 l
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
5 g2 Z0 T p* _
</tr>
3 Z7 L7 ~/ Q# t3 k7 g" G6 c
</table>
% y2 C2 V; [5 F6 a7 w8 r2 i
</form>
8 R5 G& d' Z6 ~5 H2 B$ G
<script language="javascript">
4 n2 y& i* W8 d$ s
//人名移动
i& }' a" ~ x5 k" G+ X
function move(fbox, tbox) {
' h0 @* Z1 G2 U6 _5 i8 d
var arrfbox = new array();
& ?3 e9 T" ]8 _3 i
var arrtbox = new array();
+ U) f* @- l" X: L) G+ T
var arrlookup = new array();
) ^/ g* F5 @- k$ N# {
var i;
8 K2 i1 j# j O
for (i = 0; i < tbox.options.length; i++) {
" f" o( H& ^! `# M
arrlookup[tbox.options
.text] = tbox.options
.value;
7 S* Y' x: L6 [7 S0 B4 g& G
arrtbox
= tbox.options
.text;
3 a% a _( k* t1 Z6 e0 g
}
5 V: U7 I3 A' o' R9 V2 d3 C
var flength = 0;
( z$ |7 x, u5 i. N: o
var tlength = arrtbox.length;
# o5 @) q+ l* M% d- s1 O5 c
for(i = 0; i < fbox.options.length; i++) {
2 l; s8 S$ M& {# O# l- Q
arrlookup[fbox.options
.text] = fbox.options
.value;
. a) z+ C* z, E" S( F5 ~7 x0 X T
if (fbox.options
.selected && fbox.options
.value != "") {
, y5 l% E, |" p. I& u: f8 z2 Y
arrtbox[tlength] = fbox.options
.text;
& e* @) r0 f% R. W5 r% J
tlength++;
C9 y% _/ m0 ]! ]
}
0 p6 ]: Q/ E; s% c. ]1 H* C$ a, U! ~
else {
/ u7 z2 V' r: |3 u
arrfbox[flength] = fbox.options
.text;
5 z5 |. H4 {' w* y* I
flength++;
5 b: k1 F/ r. k; J
}
' i8 `" H1 c2 C. {* Z3 {
}
# C. B: l% I8 g; Q
arrfbox.sort();
5 _+ g. n' M5 e( k' ^
arrtbox.sort();
z( s5 u7 Y8 U) I3 V: D8 D
3 z# M! t* C5 _0 Z5 c
fbox.length = 0;
' v8 |: ?+ f, W- @
tbox.length = 0;
Y z. r1 r- L
var c;
( [' c, f4 b; l9 e- l. m
for(c = 0; c < arrfbox.length; c++) {
8 _4 Q5 D* ?7 `3 l
var no = new option();
* i) M6 V: G3 |+ u6 p+ ?
no.value = arrlookup[arrfbox[c]];
, q6 m. Y: \6 y- E7 @$ n# b) @
no.text = arrfbox[c];
) n! I3 f2 t+ v; b9 H
fbox[c] = no;
7 J1 S$ d/ d& G8 D
}
+ i) r* o$ E. Q7 r3 v6 C: B+ t
for(c = 0; c < arrtbox.length; c++) {
5 S3 Y* C7 Q" z' Q# @& Z
var no = new option();
+ B8 g& E1 \0 S) }7 G& ` x: t# \
no.value = arrlookup[arrtbox[c]];
5 N7 ]; H* E# F8 u4 @; W }: @
no.text = arrtbox[c];
1 Q" @8 l- G8 L' @: }8 e
tbox[c] = no;
- `( y$ ?; K/ D) r$ y& [4 b
}
' B i8 M4 N+ p" V2 h
}
/ t1 K) t. j8 R" [+ D! H
</script>
. ]1 y( j' O; ]7 z
</body>
% |9 d# M, g, S8 b% n* W4 o" }
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2