jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"  n: r1 ?) z, H. I
      c pageencoding="gb2312"
%>/ F5 z9 w0 R) e& m# ~
<style>
.f9{ font-size:9pt; }1 g0 _' J9 Q( s3 }0 H7 j
.bgc{ background-color:#aecaf9; color: #0033ff }6 U$ x+ K8 x* Q' C6 s8 }
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;4 O  Q' e7 X0 D, n) A
  padding:1px;
  margin:0px;}
</style>5 X% k+ Y9 [# s0 H9 T( `
<script language="javascript">3 i6 F1 K* [! [8 E' c
. ^1 w$ C0 G5 P. l% @1 O6 T
</script>5 Y* u' e  y: _/ |3 `  W
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
& m7 K' z2 l% j7 j# Q- O3 W& D<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
# h  R9 f: e1 H% b- R<%- A( D  [- v$ }; A6 v9 Y: m* _/ A
  cdatasource ds=new cdatasource();  //数据联结bean实例
9 w! c0 N& g  W$ E, ]0 [, l  java.sql.connection conn=ds.getconnection();
" c% z. b$ E1 m  java.sql.statement stmt=null;* z7 s6 v% A$ ~! t" X
  java.sql.resultset rs=null;
1 H, w% i8 R# s5 f  cdatacheck dc=new cdatacheck();. F# C/ y; ^1 S- u0 \/ W
%>
; k! b6 X* g" Z8 e) z8 d0 {  ?/ m2 q<%
$ M$ e" E5 ?$ z6 Bstring 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";
! m% \6 W# s# C0 P0 b8 D  \stmt=conn.createstatement();
6 s5 H7 A! t; F3 y9 b! D" D( j* P# lrs=stmt.executequery(sqlu);
- K# @' M  ^- Y/ |8 k7 M%>
* ~* n7 [' f5 l3 A& ^$ G6 W- ^<script language='javascript'>
" o5 t% e( r' \& ^9 aarr = new array();3 X1 f8 K; w4 G$ w
<%  int temp=0;* X3 ^! `' F# B. @! s
while(rs.next())) N7 R- ], r. q# _' G
{' C* T$ Q, @! M6 l+ C$ X" l
%>7 z: V3 K0 z  F
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
; F' |  I3 c$ ^0 `1 i: J  X<%
! h# R1 J- I7 `' }/ S4 u) |2 ttemp = temp + 1;
5 h5 r  x+ t6 X1 i& Z}
9 c9 M9 G+ ]* \9 F%>
) j9 ^! J" e: l  _! p2 Ltemp=<%=temp%>;3 ^8 o2 l  {1 v% f9 c/ ]. i: Y
function changelocation(id){
2 Y& t% T: P2 c( K  k3 Zdocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
, P& H8 U" `1 ?, Dvar i = 0;
% a* L6 M; }' F7 g# V. a2 idocument.combo_box.city.options[0]=new option('-------','');
  i# t. V4 F+ y( {$ J' v% {" I4 gfor(i=0;i<temp;i++){
$ a4 c0 J2 D  L' y4 z2 O9 E3 X4 b& sif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]   r! I& Y; _" c" |
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
- g$ ]5 j* i) [  z# S" F2 R} 7 `  l; t: r$ }+ P5 `( f7 U
} & ?8 `% h- u1 n1 s
} $ s, M" j: f9 f
</script>
( C# I% h$ @  o2 [( t& X9 H( f/ Z& p0 H) b" g0 f
<form name="combo_box">
' w& x9 G) g0 ~) c' r) t( |$ _* t<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">  S1 Y$ F0 R6 @9 s* V
  <tr height="24">0 U4 n: I) ^& d1 A' m8 L
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
) J' w, s; r9 X! n <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>) s' x% m" h+ |/ |! s- n$ M
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
; ?) M. _' X# Q; Y <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>: M) S/ t4 A7 V+ {+ J
  </tr>! x! ~1 G; E/ u# t: t  F7 \! Y
  <tr>
: ?9 N5 h8 D0 S8 F  w <td>
+ `3 \% z, |% J  D: n9 O+ n  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">  b4 Z  B2 f6 c( Z
  <option value="0">请选择部门 ---></option>
& D6 E. A. r3 S4 N3 C( M4 `/ R) z( N<%
* z. B7 Q. I2 ?$ }) w string sqld="select * from tdept";8 |. g" }. S+ N
stmt=conn.createstatement();
: d5 B% q$ r; N8 T% u3 R  `" drs=stmt.executequery(sqld);
% u5 q  A% q; _, v" x4 |while(rs.next())
8 |1 X/ F( L) f+ I6 W: E{/ g( R% n: u2 d3 w
%>
' C4 ^: J3 J3 F  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ n6 u4 L2 N  n5 b1 i6 A2 P- o<%
* A5 d6 q* K5 R6 {0 F}
! }/ p# E' P  v% G%>
* ]7 S  S5 U5 Y+ L1 D9 R  </select>
5 |# ^0 G1 `: ~1 a5 n8 b" t</td>
  H5 s3 z5 Y$ r# [ <td>& g1 w! o) H" L3 H" f6 w
  <select multiple id=city style="width:150;height:200" class="bgc">
6 B8 I9 N1 |# b6 `- o0 u. s$ M  </select>& ]" O, _+ J' Z) d# v  a, V; k. E
</td>
2 h% a6 V3 {6 a% L$ F1 C8 h8 R <td nowrap align="center" class="bgc">
6 c9 `5 ~; l$ F7 Z* R& c% X5 q  <input type="button"  value="<<" class="buttons">
/ w6 Q6 ~" |3 t; x5 h8 T, a  <input type="button"  value=">>" class="buttons">, }; R8 O3 k+ o" n6 z  R
</td>) i6 D- _! n) ~8 m( R5 x" C
<td>
# [' M  ~  C- {8 Y5 }& R  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
+ R& b5 F6 ]2 K; V  </select>
: G5 q! i$ g7 l; m</td>& q2 ^2 v% B% V
  </tr>8 j+ ?1 T; {& h+ k" j8 H, c/ U; c% y# o1 {
<tr class="bgc">
9 |  [) H7 x- J <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
- h$ j! D5 H- j( R1 N6 e  </tr>2 }8 L9 A5 |- Y% h. M
</table>, B. d0 r. N% P; j3 L9 ?
</form>
5 B4 H6 ~2 N0 N$ N0 D+ [<script language="javascript">+ @) n* H9 {1 t  J, Z0 o. H
//人名移动
0 G0 _+ D4 r# Z! ^) N3 ifunction move(fbox, tbox) {$ d1 u7 G1 i9 n, M$ T8 ?
var arrfbox = new array();$ Q5 X) w2 R0 @2 r$ {* Z
var arrtbox = new array();0 H( k: T& A! E
var arrlookup = new array();3 Y- r, B  B/ z+ T
var i;
0 x+ H/ I0 {7 E$ p! `. |9 Tfor (i = 0; i < tbox.options.length; i++) {$ V! |6 G; x  W* ]8 u
arrlookup[tbox.options.text] = tbox.options.value;
1 z3 F& m& q8 i% l( darrtbox = tbox.options.text;
; M) F+ b4 T9 M}# n" X) j1 d. G  n8 h& K8 `/ P2 m
var flength = 0;. j" b) [" v' z) {9 ~
var tlength = arrtbox.length;9 P( e: T7 T7 a$ X% ^$ _
for(i = 0; i < fbox.options.length; i++) {7 M% v) Q* W1 R% v: C: J8 [
arrlookup[fbox.options.text] = fbox.options.value;
/ d$ M8 m' o* \0 a( fif (fbox.options.selected && fbox.options.value != "") {
! t$ A) ^9 N6 T  T' v  g- Narrtbox[tlength] = fbox.options.text;# ^8 A! n0 Z6 g1 g# G; [
tlength++;% l" N) x+ s4 p# K- L0 \7 ^
}
2 r' c% {7 C! nelse {9 n; H" \4 l1 q" c8 |
arrfbox[flength] = fbox.options.text;3 e+ ]5 }8 p( m& d8 F6 A
flength++;) T7 r! g4 L, _) g7 O, C: {" m
}# r' y  ^3 [/ r( \$ r& f& S
}3 h" ~6 D* v  z8 W; }
arrfbox.sort();
4 L( i! k; [5 k% @arrtbox.sort();2 S  p# [6 B5 k2 Y9 p, h3 z+ @

; F8 k( E( S- M( Gfbox.length = 0;9 B: j; d2 z! l. _! e
tbox.length = 0;
% o! S" t4 j0 J6 Z0 ~+ xvar c;5 Q: H' S# f& O: ~( b% D
for(c = 0; c < arrfbox.length; c++) {5 E) `5 _" D% x& q8 ^9 v3 L0 k" C& H
var no = new option();1 ~3 [9 z& k$ q) p- _4 v
no.value = arrlookup[arrfbox[c]];
. j% _7 i$ t  W6 p& q) nno.text = arrfbox[c];  L7 p6 j! ^- \( W$ l4 e# J
fbox[c] = no;! n! [% V! r; R* D. Q
}
2 o2 }: Y' }% R6 T, Zfor(c = 0; c < arrtbox.length; c++) {
% c' C5 W3 I: B! V$ Fvar no = new option();
  U% E& f  H( K7 o' D( hno.value = arrlookup[arrtbox[c]];* D0 ], e7 s/ b' y. U# l; @4 a( m
no.text = arrtbox[c];
& j; P- Q9 `3 Y* Etbox[c] = no;
3 T+ X$ j+ U; i  y( P/ c7 _7 \& r }
4 ?4 p1 ?( Q9 B9 f7 f- A}  A: E  x' t) N' p$ W% s
</script>  g: C' U) F6 R4 d
</body>8 Y9 d7 Z+ s% I2 L) K9 g& L6 o6 x

捌玖网络 89w.org----致力于站长学习交流

返回列表

jsp+javascript打造级连菜单

[收藏此主题] [关注此主题的新回复]

[通过 QQ、MSN 分享给朋友]