Board logo

标题: jsp+javascript打造级连菜单 [打印本页]

作者: admin    时间: 2007-12-5 17:43     标题: jsp+javascript打造级连菜单

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
& q* Z+ w% k0 ]; L, m# c1 u         c pageencoding="gb2312". |8 E7 |# l$ }/ R* |
%>
4 L" h! c% H" Q( E4 c. \<style>5 V" z/ ]4 c6 b/ ]8 _9 l
.f9{ font-size:9pt; }+ e, C/ e/ f. ~. C
.bgc{ background-color:#aecaf9; color: #0033ff }
# L( C/ M. |# J  K0 o.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
' Y( {! K* X+ s8 E6 f1 S: B3 r1 |  border-bottom: solid 1px #4e7dc1;
& R8 [# S; j9 p, S  border-left: solid 1px #aecaf9;
$ z- m- S3 o- \  border-right: solid 1px #5679bd;
. \& `2 B3 u& ^0 @: s& n  padding:1px;/ Z& J$ X+ w: z% K& B( {
  margin:0px;}
. C2 H0 v. _  T( B$ I7 C</style>
6 s. ~  ^: {5 ]" W1 P; A2 ]# e+ e<script language="javascript">
$ ^$ U; Y' z7 Y8 e: z' K8 J<!--! J' E9 P# J5 `4 I! K8 a
function rv()' |2 F3 ]/ L6 `! L' z
{
, `3 V) D& Z( ?1 h  var val="";# Q6 U, Y  S5 ^
  for(i=0;i<combo_box.list2.length;i++){: A7 Q$ l+ Z% P& M% E. g
   val+=","+combo_box.list2.value;
! a) C/ K! d( n1 f8 [# g5 v" W  }' q. ?" u5 [* V  [4 q. l
  if(val.charat(0)==","){
0 C6 ^" I4 ?( }- w& _   val=val.substr(1,val.length);' g* `% G. ?$ U$ T6 R. N
  }$ X- r; _& b2 n7 p' `. }
  opener.form1.frecname.value=val;8 y4 ~: j4 }) S0 g( i6 o
  self.close();
- ?% @/ [% i6 E$ w) D- c}" \- i4 k0 @) R
//-->4 {6 k, h, G% ~% j  T4 _1 m; a
</script>( e: N3 l  j% z) i' T1 v0 p3 i+ Y
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
, F- ^" h. x8 I5 f# m<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />4 A: l1 R2 k9 v% ]% @( r/ B
<%. J  j# ]' S* t
  cdatasource ds=new cdatasource();  //数据联结bean实例5 q" H/ J% ^/ C* f3 o
  java.sql.connection conn=ds.getconnection();' f# C, A7 I# {3 b0 L
  java.sql.statement stmt=null;
! G% y# d! s4 W! E- I+ @4 ~, ?: Y  java.sql.resultset rs=null;$ r% N7 O, Q, K9 m. U$ ~' [( [
  cdatacheck dc=new cdatacheck();+ O( X. Q% C9 N8 h, G
%>% U% F9 f3 K7 t1 ]! f
<%2 N, \' V$ W  ?% W/ y" G8 s
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";* K+ S7 S8 S( `7 I* J5 N
stmt=conn.createstatement();
# Q. G# N6 @+ n! \* a3 [rs=stmt.executequery(sqlu);
; @# x8 w* L& C" m%>
) p& S3 X* p( C2 C<script language='javascript'>* O/ ^' k1 G2 b+ c, f. e
arr = new array();! J+ G5 S3 W4 d- j( i
<%  int temp=0;9 A6 C6 h, \/ X
while(rs.next())4 M) S' g4 |/ \5 F" N; q9 G% x/ z
{+ I) \1 p4 D6 J9 q& x* U
%>* n5 A! c1 G8 G( U
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");; Y, A! w! p( X0 l
<%3 |2 z" q7 u% E$ Q
temp = temp + 1;
, |5 g/ N' H0 ^+ H. ]3 B7 _' W}( `- O% l  `2 o6 Y2 M( {
%>" }$ `& |  _7 E7 R) I; G
temp=<%=temp%>;3 ^7 U3 v2 f8 W" }1 t) _" H3 F
function changelocation(id){ . {& _! [3 Z; Q6 W0 R0 T6 W
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 * y. r) k# @! f( B! s
var i = 0; & y, A( f4 H5 X; O
document.combo_box.city.options[0]=new option('-------',''); , h* C# V- u1 d5 S; P' G
for(i=0;i<temp;i++){
, V4 Y" F+ w6 s- M+ Zif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
) S& E" |- |) N1 ^# ?$ I- T  Xdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
  Z4 Z' j% o4 A; }  o) k. C8 Z} % @1 t% d9 A. X" x0 X
}
! ~; s0 d& b( K, e+ ?" @  S  J5 C6 u}
5 g$ [5 C' F0 |* `% z7 g. O* [</script>
: b$ T2 b, k+ g/ G, p) {  `6 g& b4 `: F. b- d
<form name="combo_box">( \% L- Q: d6 j0 h5 n
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
- I  b/ @; K* |* v4 n5 B  <tr height="24">
0 H/ g, ]/ m+ Q    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>& ]5 l5 q0 Z, }, v9 `
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
, Y6 F6 C: q( W9 D1 j7 [$ H& U    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
+ j2 e& F4 ^; {5 V6 Z& G: E    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>( P, d5 B; L0 |
  </tr>' q, S7 N% ^9 m: m* i
  <tr>
( F4 }7 g. f. O+ U9 P    <td>. d8 H  z$ O$ ^$ z" h4 ]
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
2 ~6 a4 A! N2 W' c6 q$ s1 n' a- R: c  <option value="0">请选择部门 ---></option>0 R" L6 t" Z- ]  q* }) q
<%6 b% Q& a- I2 F) [% ^4 z+ e
    string sqld="select * from tdept";, B' A( G- l* W9 F& n
stmt=conn.createstatement();
8 [) F9 \, Z0 I, X% h6 b5 srs=stmt.executequery(sqld);; j/ L  D/ \, i9 e" N- m! x2 H
while(rs.next())* a2 y) Z' S6 H9 a2 `& T1 T
{
- p5 w( j( E, c3 d6 @%>
4 t. U: j5 c( m) Y0 M* d7 D  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
+ ]) E" D! v7 z  \) V$ C: p<%0 w0 y. ?  v0 v3 Z+ c
}2 G7 x& @; E( _5 a" O/ E7 @4 v
%>
$ N  }  n" C# }( p# L* M  </select>+ h# {+ V/ `- x5 y# m( p5 d% E9 T
</td>! }) x$ u  U# j" i! q
    <td>3 B# m! d4 _8 N$ A* q* e% }# O
  <select multiple id=city style="width:150;height:200" class="bgc">" e- F, B5 Y' [
  </select>
1 [9 o) `3 c# F7 ]/ y7 c</td>1 p( N  f% x4 m9 ~, d2 ?/ I- ]
    <td nowrap align="center" class="bgc">
, R$ `1 z5 Y$ l& N" H5 J6 b3 Z  <input type="button"  value="<<" class="buttons">
: d( \, r3 \5 B  <input type="button"  value=">>" class="buttons">* I: F  T( |) @# G- z! u" p# x. c
</td>
7 N# b: R0 n, W    <td>8 ?0 ?, S+ `6 S: r+ ]  D; \
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
5 e; C$ a5 T! I; H5 m. M7 F5 @  Q  </select>
5 W9 E7 B& }  R& w. h7 `$ G5 t</td>
7 Y7 U/ P" k, D' d5 X) R# Y$ }  </tr>
5 W+ O  U) ~3 {8 Q- B2 b  T  t) G. W    <tr class="bgc">
7 g; w- \+ O* Z4 a; i' Y    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>: H% s8 [, ?! O, X# C! e7 M
  </tr>
, M! T# E% V8 w/ Z& o0 C) j</table>, L, m- f) `) J
</form>
8 M: x  }+ U' a) t3 g! n5 M<script language="javascript">- j; X- M& W5 j7 {  n
//人名移动1 [  x0 S& x. l( r. {- l
function move(fbox, tbox) {
+ z" j. `  j8 ^var arrfbox = new array();5 L: R& V$ P& \2 Z
var arrtbox = new array();/ g9 L5 {5 b1 ]8 k0 x! L
var arrlookup = new array();$ B1 w0 N9 p# l5 `& b; n1 Z- @+ ]
var i;
4 H( x2 h& g- Qfor (i = 0; i < tbox.options.length; i++) {
4 l6 K. O' H  r/ ^arrlookup[tbox.options.text] = tbox.options.value;
, F. l& Q( q3 j3 r" W. {  ~arrtbox = tbox.options.text;
, c5 ?5 z. o3 g* t# N}
6 G5 T  k* {. W- C' ^var flength = 0;
8 f1 ^8 X' w. D/ l/ m% rvar tlength = arrtbox.length;) M+ T6 W. w$ R1 |( S2 E3 C- c
for(i = 0; i < fbox.options.length; i++) {
6 h  n( u+ g) c% B1 Darrlookup[fbox.options.text] = fbox.options.value;$ L/ v9 g# c% y2 O8 ~. B7 S4 E
if (fbox.options.selected && fbox.options.value != "") {
7 H7 w) l$ A4 H6 @arrtbox[tlength] = fbox.options.text;
- S! I+ k# y7 m4 _' I& J$ Dtlength++;0 l4 z+ o7 e/ e2 A+ l
}
% |1 ^1 x. I4 S3 M, telse {
: w% m* c3 z8 ]3 V: j2 ?3 {arrfbox[flength] = fbox.options.text;
/ p& \# \: w4 Hflength++;
* [% u$ O+ g4 H( s1 t. r  o- H! {   }
- T: c# y% w  [) E( n$ N2 M7 `}
  h& `) F; v) q4 H, v/ ~arrfbox.sort();
+ R; [* J. r5 T4 Parrtbox.sort();! t- W' b, s0 u; x

' }' N6 X7 X8 H% A/ cfbox.length = 0;
' [8 Q" k+ N  Q, ?8 Utbox.length = 0;4 F7 P; p0 k* d
var c;7 m* \/ `( V' B: Y/ l1 y
for(c = 0; c < arrfbox.length; c++) {
1 x- E6 i3 a. R, M$ ovar no = new option();9 G0 X0 e& z  X& Y
no.value = arrlookup[arrfbox[c]];, W; W' t/ B1 s% s2 }6 Z$ z
no.text = arrfbox[c];  f0 n$ V* y$ z: w, i
fbox[c] = no;) h( t8 ]& I. g- j6 `% y$ Y4 |
}) G$ ~* O5 F: b4 O/ z
for(c = 0; c < arrtbox.length; c++) {
+ f% `) U; p5 {3 ?var no = new option();
) E- \5 p$ ]6 t9 M2 H! bno.value = arrlookup[arrtbox[c]];! s1 f5 W" f. a
no.text = arrtbox[c];
% _8 Z/ o( z+ Ctbox[c] = no;2 B/ P8 e0 ?; P3 o& U
   }
- {# Q& S0 L1 ?0 [  g}
+ Z0 Z4 \: g- D4 U8 X) M3 T</script>
3 `, O2 |" C' }</body>7 a5 J2 O$ d. M# z





欢迎光临 捌玖网络工作室 (http://89w.org/) Powered by Discuz! 7.2