标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
: s; V- \1 C% S/ t1 B, \
c pageencoding="gb2312"
. T& \: c: Q7 X. R
%>
! i2 S, [+ ` F. \& Y ?! n9 J2 L
<style>
& i3 a* t$ h, a, h
.f9{ font-size:9pt; }
3 y% }2 D0 H" K- O# g
.bgc{ background-color:#aecaf9; color: #0033ff }
9 O: J5 m# x+ }. x# i; ]" K" r
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
* F4 V/ o9 {- a) z3 B
border-bottom: solid 1px #4e7dc1;
" l8 d0 J0 `" c* Z+ X' B
border-left: solid 1px #aecaf9;
! Z& @3 i3 p& t/ e3 S* R7 I
border-right: solid 1px #5679bd;
! a1 Z4 ~+ i8 E0 ?+ M, R7 J
padding:1px;
7 T1 G/ O# G' C( p8 \, A; v
margin:0px;}
. \% W9 E) P! z$ n. a; L
</style>
& s" j+ v& t1 Z# p4 G
<script language="javascript">
8 d, @6 o% j, A1 v
<!--
2 D3 p; r3 J. Y. {
function rv()
) H/ t- S4 p' r; l& u
{
" @# O' `; e- x$ e/ ~
var val="";
) `$ ? h: e3 e; L# ^* J
for(i=0;i<combo_box.list2.length;i++){
/ a& ?% x0 J- p& ]9 x
val+=","+combo_box.list2
.value;
7 k2 {) y2 Z, q0 ~
}
' q. p0 a% i4 k7 B( c$ J- p
if(val.charat(0)==","){
3 D- ~" V' W. R7 A! X0 P( R
val=val.substr(1,val.length);
- h( s+ T. n$ d0 W1 B
}
% @4 K2 t/ C% N; h4 ~; B7 K# V
opener.form1.frecname.value=val;
; d, R+ w- ^+ s y3 Z
self.close();
' z" R2 W" |5 u+ s
}
. j3 s% n* N2 A0 @6 a+ @+ {
//-->
; o# J+ l# _3 m8 H; Y
</script>
* K) t" j, D+ u; t% \" k' l
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
& X0 f* U9 X/ u6 ~
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
) o8 U+ W$ D! Z& k, N% E: D
<%
9 G/ E0 P1 _/ \% X; I4 ^! l
cdatasource ds=new cdatasource(); //数据联结bean实例
! `3 E+ C# W8 K }3 B
java.sql.connection conn=ds.getconnection();
* m; `9 E V6 h) |5 {) Q( g0 Q) j
java.sql.statement stmt=null;
9 S1 z/ i% g1 L. j6 G/ T
java.sql.resultset rs=null;
7 n- s# x" L6 c4 o( t1 d% e
cdatacheck dc=new cdatacheck();
& D+ Z2 z9 i; u3 j2 |' r1 g0 _
%>
, s- L& M0 k: [1 F
<%
8 r9 i3 y: A" e C+ C, S: {( M9 @
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";
( a8 x5 ]1 W% _# ?3 g
stmt=conn.createstatement();
/ V" z! A2 d0 X5 T3 Q3 `2 a6 k9 d
rs=stmt.executequery(sqlu);
) b! F( d3 L8 s7 i- }# M
%>
8 g: r8 M/ n$ E0 O% g
<script language='javascript'>
# t; f5 `1 \( a2 c2 N$ P
arr = new array();
, O) m/ e* s/ I' L
<% int temp=0;
1 m, }2 p3 x, L$ c! S" q' d
while(rs.next())
) T9 N1 f% o, ?
{
: B$ K+ G$ g. C g9 @
%>
3 \- A- I- c! L/ I( x
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
+ }. J6 t% x. `# }. \- d- \
<%
$ R' G; ]! l0 Q: q+ }: a$ N- o
temp = temp + 1;
* j" U- r2 [% S$ E# R5 X
}
) a; H0 x+ s0 r% d1 D
%>
& U! T% T" E, N1 f8 s6 N; t
temp=<%=temp%>;
/ |! u _0 h+ I6 |. |2 R" Z
function changelocation(id){
2 t9 m7 m5 ^! I" p$ C, J- J
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
+ S# R5 C4 X6 \3 R$ I2 J% B$ U, \
var i = 0;
. K B1 t7 K7 U; G
document.combo_box.city.options[0]=new option('-------','');
4 t5 s1 u8 e% k3 h) Q1 x! N6 i9 t+ T7 V
for(i=0;i<temp;i++){
, a4 Z$ ^. D) U, y2 G
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
. f! q/ _3 D, C {; b
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
7 Z0 i/ e' C7 D' g
}
# N2 h- r& E: U" f- K2 r
}
/ M" J* w( b! T% T
}
0 J; l, P. E/ d# @2 a3 w- |2 t
</script>
/ Y) [1 m% F0 G) \! L2 w" A
( X% x6 h! h6 [9 n* F
<form name="combo_box">
. Z+ [6 ^2 Y2 k* ?" u, e4 N; I
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
2 \6 G$ ~0 [8 \
<tr height="24">
) q; h' x8 Q; z2 X/ ^* E6 \7 E
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
& R( B. ~- S1 t* w6 {; O
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
- c; w% K" ~: q' j: _7 j/ G
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
3 K: Z- t4 |/ O- A5 ~5 m
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
9 E# m9 t' ?5 x5 s
</tr>
( t6 a+ J) F/ [6 g3 h4 ]" [5 R
<tr>
, N# ? z8 a9 Q6 Z! X* [8 i( F3 `
<td>
* l& T' A$ B8 `$ k
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
. Y7 E6 U2 x+ N6 S1 I( _1 X
<option value="0">请选择部门 ---></option>
2 ]$ k# s" ~7 ?3 v
<%
; g! s! w2 Q1 K/ O
string sqld="select * from tdept";
8 }; B* p; @, U4 p3 t) O
stmt=conn.createstatement();
A' I( l1 X5 J$ f* _" O* ^6 Y
rs=stmt.executequery(sqld);
2 L( v) k. c4 z
while(rs.next())
3 b9 A* k2 m7 y! Y" I
{
* g! L+ x" R* A) v; f
%>
9 w4 W0 A# | v: e
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
* l3 |, v+ \! J ]
<%
+ |8 c- g0 p3 L/ ~# S3 O9 ^7 o
}
% D' A. ^- k+ e+ c/ r4 z) ]
%>
: u2 _( y2 N! F6 l
</select>
9 A- E* ^7 ]* P! i
</td>
! t1 p. R7 C, {5 Q4 g
<td>
* J5 Q4 `, _9 S( C0 X
<select multiple id=city style="width:150;height:200" class="bgc">
/ [( O% d1 }* K, w
</select>
; }8 x3 c0 } j1 h0 g
</td>
) A% Y9 F7 Z' d$ C' F
<td nowrap align="center" class="bgc">
6 j3 \" p; d' K' _' G" V
<input type="button" value="<<" class="buttons">
: r5 T" Y/ v9 t) z) s
<input type="button" value=">>" class="buttons">
3 _" S' \& G; ]7 W* N
</td>
7 n9 T; l0 p5 @5 N& x( o5 p
<td>
+ ?4 u4 I% q" Z5 u3 J
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
; L" `- U7 Z7 Q9 m: y5 ]. R8 G$ F
</select>
! I. n2 v/ ]; ?* p$ ~3 I# F
</td>
9 l6 }) q( e* `% a3 B' v
</tr>
; m9 e J2 p, u& o9 d
<tr class="bgc">
5 l% `) k' b. s0 y- n8 G L
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
6 J: ]. _" f4 @+ Q3 D) {4 Z
</tr>
; b& k* C! c1 o9 p E7 r
</table>
4 R! S# L( b# o, C
</form>
" E0 q8 B- A- C! u) D. W
<script language="javascript">
5 c- N. P$ R" r
//人名移动
2 J! }$ L$ u0 O7 y* s- L8 x6 m
function move(fbox, tbox) {
- g: j5 Z3 ]; G! a A; U9 @- k, D
var arrfbox = new array();
& \! H0 l% E5 \( F5 @5 C
var arrtbox = new array();
& J- p0 g* M9 t6 @8 z* i
var arrlookup = new array();
9 S! w5 R+ e/ J1 @. \" f4 \/ ~: N
var i;
6 l5 b, O o# X& \
for (i = 0; i < tbox.options.length; i++) {
1 v. L8 _3 u9 ~6 `8 a+ _& g% v
arrlookup[tbox.options
.text] = tbox.options
.value;
0 d- W5 N$ A1 t
arrtbox
= tbox.options
.text;
! P" ^) W$ _ v. e$ W% X7 f
}
, l" M m0 } n! h, l7 |$ |
var flength = 0;
) e: \7 H3 w/ h( a1 G4 Q. \
var tlength = arrtbox.length;
. a7 L/ z3 l$ `$ c
for(i = 0; i < fbox.options.length; i++) {
# v h4 D d1 z
arrlookup[fbox.options
.text] = fbox.options
.value;
1 h4 Z+ }- [6 i5 Y. q. s
if (fbox.options
.selected && fbox.options
.value != "") {
2 h- G3 _. K. h2 S7 f( ?$ p
arrtbox[tlength] = fbox.options
.text;
0 @7 z* p0 T6 V% {5 m
tlength++;
: L( i* x, ]: o& t' q
}
+ \# X8 _/ c- ^" k* Q$ g) i [9 h/ Q
else {
( L& `; U: e6 h, X3 h; M7 b% I: [
arrfbox[flength] = fbox.options
.text;
' w) T" v$ L3 L% G4 L! J
flength++;
2 H, M# S t7 R ]0 f. r2 P
}
' P7 V% B5 M3 d3 R+ G
}
3 z& z- a! |/ n4 B# k. X& q
arrfbox.sort();
. K; S3 V- q) d9 R4 n, [5 U
arrtbox.sort();
6 ?! g- K- s M6 X4 I* i( x. U
2 w0 l) Y& y: j1 w: o( _
fbox.length = 0;
# u' Q' z) P* s9 J) @$ _$ Z; f# I
tbox.length = 0;
9 _' Y( N5 n0 Y; A/ Z+ N
var c;
# B+ y3 [6 [8 J! C! o
for(c = 0; c < arrfbox.length; c++) {
4 {9 b/ [7 R' U3 M2 q' n# K+ D( L
var no = new option();
: J& C4 @" ~) Y
no.value = arrlookup[arrfbox[c]];
! _: f7 z) ~% W; Y
no.text = arrfbox[c];
% t l+ V+ [: O" A* R
fbox[c] = no;
8 u# ^9 [# B) n
}
# I: J: q v$ k' a* [, P/ {
for(c = 0; c < arrtbox.length; c++) {
l3 g' Z% M0 }/ B) j, h, c/ l* H
var no = new option();
% _8 I, e x6 Z6 I7 p
no.value = arrlookup[arrtbox[c]];
; o& y8 ? J! l# m. [
no.text = arrtbox[c];
6 w# ?% l9 E: H- X2 f- S9 b
tbox[c] = no;
; ?* n) A. i" b$ \' Q+ o; Q
}
" s# ^( v# X" d6 ~: g
}
7 y* f& i$ X8 b( @" x4 m# ]
</script>
5 h r+ s. L6 \+ N9 Z4 w9 W# a
</body>
5 u# F9 \, e0 J, v D
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
