标题:
jsp+javascript打造级连菜单
[打印本页]
作者:
admin
时间:
2007-12-5 17:43
标题:
jsp+javascript打造级连菜单
<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
+ p0 Y( D( l# J1 h+ a
c pageencoding="gb2312"
" a9 I: n( E4 Q' }7 I2 P7 l
%>
. S6 N! Z, W5 f5 A
<style>
3 D( B( O: F( {: v; R
.f9{ font-size:9pt; }
$ p; P3 \8 a; i* E. ?- K
.bgc{ background-color:#aecaf9; color: #0033ff }
% g0 p, u! e$ [ C1 b
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
" T0 H; W7 L( _7 e5 \
border-bottom: solid 1px #4e7dc1;
7 j( ^/ {4 y, \! U6 p) m
border-left: solid 1px #aecaf9;
- O5 z, j8 J: |9 u$ T2 \6 o
border-right: solid 1px #5679bd;
& ~7 N" f& I5 N8 C3 r
padding:1px;
) p) v# A6 p% o# l) ]+ T2 C$ r
margin:0px;}
! @+ h, g+ x ?, `
</style>
* v; A, J( N, o, c
<script language="javascript">
0 d$ K( D! p* Y) }4 ]
<!--
, }0 j Y, E. I" c& s/ J; A7 O, t2 v
function rv()
2 ^& q, R- L- k% L8 f) R' e
{
7 Z8 E9 Q5 c7 `! g
var val="";
* X/ `# O2 I, `9 A. v5 O ~" J
for(i=0;i<combo_box.list2.length;i++){
5 }, Y) Q# _! O: E2 ~
val+=","+combo_box.list2
.value;
( g8 H: \0 I7 \$ L$ a' x% g6 e
}
1 H2 ~3 k' x* @% C
if(val.charat(0)==","){
/ N2 b4 G& q7 f6 ?
val=val.substr(1,val.length);
+ [5 w/ d5 n. @5 D3 i: g
}
* q B0 I, F, w( z8 Z$ ~1 V# H2 V
opener.form1.frecname.value=val;
* p+ ~. ^% h0 j/ N( K8 G, i" _0 K
self.close();
3 ?3 F7 S8 u) \/ U. j
}
5 m) Y' H( d, d0 E* A/ C4 @
//-->
6 h/ V1 ~6 G- c& ?- g% I8 k
</script>
* c4 V: j7 v: ?
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
) O5 D: X! Y5 u) ^
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
2 f9 p; f, f# X8 t8 G6 m6 u
<%
. B& y2 k/ q+ ~- e3 {/ G
cdatasource ds=new cdatasource(); //数据联结bean实例
' K" j$ L" s" k8 j, @% v9 n. w
java.sql.connection conn=ds.getconnection();
4 e( x$ H" \, Z* c1 M1 y
java.sql.statement stmt=null;
) T! M5 j; x d
java.sql.resultset rs=null;
3 g2 W6 G2 C2 o( @9 j" K
cdatacheck dc=new cdatacheck();
3 g0 r, j& b6 H, N6 h/ x! b
%>
; s! D1 u, |6 ^8 _) U
<%
8 P! |' z6 l8 n
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";
( C8 V }* a$ D( s! T' B
stmt=conn.createstatement();
6 K; l6 Z, y/ p; w( s* a
rs=stmt.executequery(sqlu);
* v& C8 B/ F4 |/ v, i
%>
8 b6 C+ {4 m4 B$ X# N8 w% B, c
<script language='javascript'>
( K$ w( A/ I" x/ B& \
arr = new array();
2 C) R+ b, M) G2 j
<% int temp=0;
( r: h; }1 M5 v
while(rs.next())
, w2 E" l- u) W
{
; G# [' t7 L, K7 ?* O
%>
( j+ U& {1 g" V0 O6 f2 e" q8 @$ ?) a
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
. i" N* o% O# ~* }1 r/ Y
<%
$ @2 a1 l1 k! ^% Z
temp = temp + 1;
9 C# t, o' x* B: P8 a
}
: A6 k# W4 e: Y, z% A0 l
%>
4 O5 d& `% ~' Q3 e/ Q2 Q
temp=<%=temp%>;
9 n' `2 Y1 \+ u2 p5 Q
function changelocation(id){
, T8 Y) J2 h" Z0 \) Q1 P
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
7 x' b/ Z5 ^+ Z; p, S" d
var i = 0;
: A4 j+ `; q! `* \6 O* a; `/ n
document.combo_box.city.options[0]=new option('-------','');
" q* L! |! k$ F2 z( i9 a3 g
for(i=0;i<temp;i++){
7 [6 e0 M* L0 N7 @
if(arr
[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
0 I W @/ J4 E0 I: T5 ]$ ]' q
document.combo_box.city.options[document.combo_box.city.length] = new option(arr
[0], arr
[0]);
4 I' n, v' l6 G; y( M+ s6 [6 n
}
1 u+ ?2 p+ [7 m' b
}
: V5 [8 l4 @# m g# X2 N2 S
}
3 K: h0 Y; [5 O
</script>
1 Q' w0 ?! E9 c t7 M4 |' A
1 i0 [9 o6 j( i5 h' N
<form name="combo_box">
% m" f# U( _% R4 q# O# ?- i, @
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
5 S9 h7 s2 ~3 I7 T; }* D3 ^6 X
<tr height="24">
7 n* {3 G& y/ C, [ P
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
' j4 {3 p0 V- W
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
1 ?( |; z( r$ a! x
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
& Z! V' d+ J7 {: ]
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
8 _: v1 Q$ P" x
</tr>
% ?# \! d. P" B# s3 H
<tr>
K; B' n m+ {: V. u5 a
<td>
& p" [$ N0 t$ d$ @
<select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
; |. w. p8 m* H" G% m
<option value="0">请选择部门 ---></option>
1 w' B' \* B# i- Z8 |" I
<%
. [4 W- L1 U7 r9 V7 `: m
string sqld="select * from tdept";
5 f- B7 [9 x3 s& l
stmt=conn.createstatement();
; x& r; d \$ K* a/ k
rs=stmt.executequery(sqld);
- e! P( I9 \4 A/ h
while(rs.next())
" y h! E+ z2 D3 ~) L, [+ g5 }3 n* R
{
0 C& p" ]% g! W/ f9 W
%>
: e" S5 t q/ S4 t; U( L- K# f
<option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
9 |, u7 T. {# Y3 u7 p8 g1 \
<%
. \# p) A' Z- ~$ k9 ?+ o( f& c
}
' W$ t S3 X$ O! C5 s7 t
%>
: r3 y% w/ G8 w; b
</select>
# j7 X" c, e# r( V4 N1 d7 N W
</td>
; n0 L! u5 F6 w7 g% x% H I6 j8 E
<td>
$ T. b# l; _" a! q Q& e
<select multiple id=city style="width:150;height:200" class="bgc">
2 {( Y( B3 r3 F# k
</select>
$ U5 z: ]( ?4 s
</td>
4 A3 ?) K, T \2 \' A
<td nowrap align="center" class="bgc">
4 M! ]0 C9 M" b$ U# g/ [
<input type="button" value="<<" class="buttons">
J& v: v6 P/ d3 T+ n: p7 r/ J; g
<input type="button" value=">>" class="buttons">
1 b, E" m1 Y$ T$ w6 m
</td>
( }) K8 F* _" j% l! w
<td>
" O* y- Z& D$ h c; A+ C
<select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
+ t6 Q/ Z) P% `6 D1 p7 y/ Q
</select>
0 W) e$ y: z: j. `4 u& G% R
</td>
6 h- K, |6 b+ Z R7 Y
</tr>
1 A7 V0 W4 o) i% @- W1 \
<tr class="bgc">
, q- L( f, q7 Y. Y$ }+ z
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
Y# u; O) a1 U$ ^
</tr>
( e' x) K0 m- Z9 b- J
</table>
5 H; j! @% B7 \7 ?; `
</form>
! c1 m5 j0 O6 E9 Y
<script language="javascript">
+ X4 \2 H6 V' n
//人名移动
8 E# N2 C7 M- z% y0 ]
function move(fbox, tbox) {
6 g0 `; O$ A# `$ u, X0 q
var arrfbox = new array();
! O5 Z$ x; `1 `
var arrtbox = new array();
; `5 A& y' W, \
var arrlookup = new array();
/ ^0 v7 X8 |. d1 a9 ]0 _
var i;
3 [0 C5 Q0 e! n1 |& C
for (i = 0; i < tbox.options.length; i++) {
$ [+ Q7 P* {& @& p9 ?
arrlookup[tbox.options
.text] = tbox.options
.value;
\! D% z) i7 X' F$ Y
arrtbox
= tbox.options
.text;
) {$ O( d4 V% p$ T; X/ Y( t
}
$ @ D' G4 z2 s6 S
var flength = 0;
" x( b3 _6 |+ D* v4 y: |0 ~# Q% I
var tlength = arrtbox.length;
# u$ Q7 p- C6 I! l. A
for(i = 0; i < fbox.options.length; i++) {
4 t) g+ N0 _( `
arrlookup[fbox.options
.text] = fbox.options
.value;
( K2 z% ~3 z5 ?' B
if (fbox.options
.selected && fbox.options
.value != "") {
9 r3 @8 P; I! c6 @' W+ p+ J
arrtbox[tlength] = fbox.options
.text;
5 N6 ^6 o/ L8 O3 @; | u* R+ N A
tlength++;
* E) t! j) I3 t( p+ h" u: J
}
/ K6 S7 |& F0 g, U& n2 q! g* S
else {
' j) D- {6 C1 \8 M# y; E
arrfbox[flength] = fbox.options
.text;
Y+ `6 {; ?/ i
flength++;
" w0 T4 q! \( }% W
}
+ Q5 m9 N6 ~+ F
}
! O& C& g E0 n0 ?6 Q
arrfbox.sort();
& l1 R# n/ G" s9 N! y
arrtbox.sort();
E! ^- [ y" X
2 B/ c2 l3 _6 Y% K) ~# I; y+ F7 g
fbox.length = 0;
' z) f/ b8 G8 F ~: E2 @7 y
tbox.length = 0;
+ Y6 s4 E4 x# u- U
var c;
^4 {1 d l; C, Y) n
for(c = 0; c < arrfbox.length; c++) {
3 w( t& l& u! Z( ^4 i/ h
var no = new option();
" m- j+ T/ \5 g5 k5 l0 z
no.value = arrlookup[arrfbox[c]];
) n. c& N: H" e3 Y- R& ]1 g
no.text = arrfbox[c];
/ I$ P: z# K* p8 R8 v) d! H+ T! i
fbox[c] = no;
) K5 {( N% B2 j: c1 E
}
- Y3 P6 s2 l+ \
for(c = 0; c < arrtbox.length; c++) {
8 _9 Q; H0 d B6 x
var no = new option();
3 _6 _' b4 E8 j% h7 s& a
no.value = arrlookup[arrtbox[c]];
2 ?. g/ F6 }0 o, \1 \
no.text = arrtbox[c];
) k9 {4 Y' _1 T- [
tbox[c] = no;
# L3 W5 _' {+ j- N& [2 i: P
}
2 e, x; ]; k" h! u9 \+ I1 m. X. k
}
! X5 E: D D! `% p S
</script>
/ N9 e R1 K9 i) b1 N$ T( F
</body>
7 Y+ d( E G; K1 d
欢迎光临 捌玖网络工作室 (http://89w.org/)
Powered by Discuz! 7.2
