标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
9 h0 k3 {# t( m1 D7 f
c pageencoding="gb2312"
2 @7 p& p$ x0 W* n8 F7 T
%>
8 a9 T( F# D0 Q \' Y
<style>
5 ~( L* M3 j; v* T
.f9{ font-size:9pt; }
( k; A. G) u1 N. N
.bgc{ background-color:#aecaf9; color: #0033ff }
' j' O- f: t o9 n2 G. `- y) \1 w4 ~
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
, q5 Y3 o& u/ m# Z1 k
border-bottom: solid 1px #4e7dc1;
6 ?% \% K; y, L! r( G/ `+ t
border-left: solid 1px #aecaf9;
+ t8 {5 H) l2 ?6 ^. @
border-right: solid 1px #5679bd;
# z+ u! [8 U* u% k
padding:1px;
; Z. a6 m9 N: k, }& W2 x
margin:0px;}
; o0 ]* B) T, L6 H! @2 w
</style>
; \7 {; E7 A" s R2 s" i, C& Y$ I
<script language="javascript">
# V6 L+ k. A$ I
<!--
* s' b1 L+ x/ o& R1 `" L% G, r
function rv()
* @7 f$ a7 i* T+ I; ]) W* {: I8 G
{
- `4 A# u' u" L( r, W1 e
var val="";
( s. T& Q; I, i0 Y, f
for(i=0;i<combo_box.list2.length;i++){
- H0 b3 G# A$ N
val+=","+combo_box.list2
.value;
& r$ a' D( E; K; g
}
% a& d3 G4 |- O% o
if(val.charat(0)==","){
7 R) j' t$ Y' v- x E
val=val.substr(1,val.length);
# e3 ?& z+ k& \+ e4 v
}
. l4 p4 T+ @* y, t
opener.form1.frecname.value=val;
3 @( V, G5 r5 u: x. ?' H
self.close();
# u$ U: T8 b& @4 }* Z1 a* G4 O. c: Z1 n
}
4 B- |8 e- x4 P4 h# b6 V
//-->
1 F9 Z: H* k% R) F; M% g
</script>
" F2 |$ u& ?) B( D8 [2 @* z
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
0 t) g3 S- u, y0 Z+ P: l& K
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
) @6 f& m. e! N6 c- ]0 x
<%
4 E5 W4 D" ?' c& q- j
cdatasource ds=new cdatasource(); //数据联结bean实例
. S7 U B0 a, x" f* f7 K, `4 I8 B
java.sql.connection conn=ds.getconnection();
$ S* D2 x/ z E d+ a- H4 l) M: g* @
java.sql.statement stmt=null;
% s& O6 `7 X1 }2 K
java.sql.resultset rs=null;
; L7 F5 n* Q7 h! s/ t/ Q4 Z C v6 T
cdatacheck dc=new cdatacheck();
2 a) f7 K0 g+ f* e
%>
{4 p- l3 a* q4 l7 N5 Q" b% u
<%
9 o: B" N6 t% h2 A
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";
; [. F# a& \* \$ u, b: ~: i `& M
stmt=conn.createstatement();
/ [% m5 y* o- y z/ A6 ~0 m
rs=stmt.executequery(sqlu);
6 f$ H X; s, b( q$ A3 B* e+ F
%>
' A' q" b5 ~# s) B! n) C2 ~3 G
<script language='javascript'>
7 ^ u# C! d+ Q( g% y# w3 Z
arr = new array();
; T6 B2 D6 L6 D0 s3 l
<% int temp=0;
& N2 d2 h! O/ a5 ?- P8 |
while(rs.next())
$ ?4 T4 o( j4 D
{
; s: r+ i/ R" ~* r. m1 |6 v- n
%>
4 [% Y/ s( T# U+ p! {
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
1 s/ A% u$ ~; T' W; O o' d
<%
1 V4 [+ V: B9 O3 C- n
temp = temp + 1;
# ? x- \# z" B- d% I0 S
}
( m) p$ I% ]* M1 D+ z; m% p H
%>
- j5 q, m+ D" w+ C3 q/ u; E2 f
temp=<%=temp%>;
9 v1 |, h/ i% G( B1 S
function changelocation(id){
- |4 l" d: j& k! {6 _# v. G
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
. L+ V) Z6 i1 ]: d# l9 v4 D/ l
var i = 0;
& T* N, O0 A5 t) t
document.combo_box.city.options[0]=new option('-------','');
( n) T! u' @) [/ _- T8 i9 ]
for(i=0;i<temp;i++){
' N& ^/ ?! \' j; a, I7 x+ X5 o$ N
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
& t2 J$ k8 ?, p1 ?
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
! a0 C B2 E/ W {3 L
}
3 o' n$ {8 E% a \# X% Z8 K6 m8 |7 Y
}
; |/ A4 ~) b3 M& a
}
5 ^3 T, L! I7 u" \( K
</script>
, p( R) Y. t6 A, V% d+ V6 s) Q( C
9 |: h# }: E% N U
<form name="combo_box">
* b6 d" a& w) \; F7 M3 Q
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
9 P: I" v6 g% k' L9 L4 L" s7 k
<tr height="24">
) R v/ l0 c( ?0 e. ~) |/ W% F
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
- \; \; n& d# ~2 l
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% h9 ^" `9 G/ o: Z0 F2 V; p% E. _0 T
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
& M) c0 N( w g0 q2 d, E
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
/ }3 G4 P# Q: `5 l
</tr>
! A. @, a s' H% x% X
<tr>
6 {. Y: u1 X* e( h
<td>
* _3 S& M3 k0 y3 Y- F
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
| d ~$ L/ H0 {, @- D
<option value="0">请选择部门 ---></option>
p+ f+ n- l$ o7 W" w
<%
& |6 x% p+ V( _ b% Q0 f
string sqld="select * from tdept";
) q& z6 n) `+ y. U& g5 T
stmt=conn.createstatement();
9 j9 F" i% O; S9 a) M: P
rs=stmt.executequery(sqld);
. Q, F' j' L3 c G; T1 d" L
while(rs.next())
/ N0 x: z* K- V/ x* R, I
{
" O! s, g& f1 A' E2 S; W2 y& Z
%>
, C+ z; P7 E) e' |7 b
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
; ^2 }- ~8 t, a/ V8 v" z+ a
<%
6 B! m: |3 w2 O. o! z) I0 K8 X' ^
}
1 q: ?+ z5 {6 E$ T' V ]6 ]
%>
% ^6 [5 D: _( M& ~3 U& L
</select>
5 v* d3 a4 z$ w- }' [
</td>
/ A, g+ \+ ]) f( H' m
<td>
* Q z0 o. b" ]) F6 k/ S7 b
<select multiple id=city style="width:150;height:200" class="bgc">
, l/ i8 ^. J& j1 @
</select>
3 f: |. y. g6 r5 k: C) W: \9 D% ~
</td>
, I. t+ j; U6 W6 b: A
<td nowrap align="center" class="bgc">
6 }+ h" A5 J& Z% u0 V! Z
<input type="button" value="<<" class="buttons">
6 `! Y, T& o$ ?. ]
<input type="button" value=">>" class="buttons">
+ {4 ^) Z/ Q1 [' S4 N5 ^! W
</td>
! v5 [3 U+ H F
<td>
7 A2 X5 x% I; w; c6 N) u
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
- W8 u* N% q: H. Y1 d; u7 X
</select>
: D" I7 B( ]+ G) D
</td>
9 P5 j1 ~; S) x- O! O: m r
</tr>
# \& p# b7 y- _; }3 p$ m- w
<tr class="bgc">
1 h" w6 Y' C8 E/ e; k! D
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
. b% y3 V1 U& i; V% c
</tr>
/ U$ D9 C) D, N* l3 S8 j
</table>
4 ^+ o0 C3 B S9 G$ q7 F: a
</form>
* V7 D7 p% h7 d5 n, j
<script language="javascript">
" J4 x+ y' R Y
//人名移动
6 A; u9 z3 r" X
function move(fbox, tbox) {
& I$ l$ x0 T; {2 E7 V5 E; t* R
var arrfbox = new array();
u0 t, O* y6 s8 u$ R9 g- V' E
var arrtbox = new array();
5 z O) ]# m: t- v7 p
var arrlookup = new array();
. s# i1 C/ M# i* L0 q8 S6 R) {
var i;
) W W! Y) x: l( P' R/ j0 A
for (i = 0; i < tbox.options.length; i++) {
+ ^$ q; j- Y/ a
arrlookup[tbox.options
.text] = tbox.options
.value;
+ j. K0 ^- ^# f- o8 G" Z, G
arrtbox
= tbox.options
.text;
4 `- [ P( P& E' B* }
}
! y; `7 H) a8 l3 S
var flength = 0;
2 w* v7 y' Y( S! ]0 x8 t. j
var tlength = arrtbox.length;
; W5 W8 R/ \( H$ v/ L R1 v
for(i = 0; i < fbox.options.length; i++) {
: `9 ?' [7 Q# n/ u Y- n. x- Y6 v! i
arrlookup[fbox.options
.text] = fbox.options
.value;
# a! q E- w m' M' I& O
if (fbox.options
.selected && fbox.options
.value != "") {
8 u& N8 H! L! k8 f" v8 n; b
arrtbox[tlength] = fbox.options
.text;
, `, ? W! X9 Z4 x, w3 K3 r
tlength++;
. e6 S4 ?! M6 a5 N4 b9 q7 [
}
' G$ O8 q. J( x5 L
else {
7 }+ Q. j8 {6 B
arrfbox[flength] = fbox.options
.text;
7 T4 q/ l4 a. A- j7 |
flength++;
& F* u l! W* L
}
5 D+ f+ }# v5 G: e" c5 s' d! R: e
}
6 G7 z I. l# R: L7 B% a) |
arrfbox.sort();
G: B6 ?" [0 Y7 r: O% P+ T
arrtbox.sort();
* x, O) k; c; Q6 a
4 q; j& s0 S. m1 g
fbox.length = 0;
7 N. S- c+ M3 [: p' u
tbox.length = 0;
- z- e7 p( g) \% z" z
var c;
! e1 \) H2 K7 E1 w: s' b8 k2 I
for(c = 0; c < arrfbox.length; c++) {
( B" f5 X/ S K4 O% M
var no = new option();
" Z4 O& |5 v+ Z5 H
no.value = arrlookup[arrfbox[c]];
5 x5 l9 k/ H" t# B( k8 E
no.text = arrfbox[c];
3 `) a) r; C1 O& u8 N6 S
fbox[c] = no;
6 A" ~) e/ ?3 u; Q3 S
}
- {# Q: G7 Q) t U7 [5 _/ L! ~
for(c = 0; c < arrtbox.length; c++) {
# G$ A" x5 Q4 G& L" u- ]
var no = new option();
5 D9 t1 ^. X( W$ Z! v/ e6 u
no.value = arrlookup[arrtbox[c]];
4 n( O9 Y5 j4 Q7 |( C7 ` M
no.text = arrtbox[c];
3 T) U) R4 w" G- O+ c
tbox[c] = no;
" w* l) c L7 v
}
$ `- {# t9 w* g( } h
}
# q1 [" }. S: \* `2 H
</script>
* }* P! H8 { E- \5 Z$ x1 e
</body>
' u3 r3 x% X* H8 @( l% X
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
