Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"+ v0 h! ?3 a$ `3 l' X: ^
         c pageencoding="gb2312"+ k1 a  ~3 F8 B
%>$ M. C# I, M" L  z7 o' n
<style>
7 ]$ J/ h$ v# W1 k7 h2 x.f9{ font-size:9pt; }
7 G6 h" e3 Y" J5 j.bgc{ background-color:#aecaf9; color: #0033ff }
: @' O8 ^2 N. ]( X! Z) e$ u8 n.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
3 V9 S$ N0 |. c5 j9 A$ o) Y  border-bottom: solid 1px #4e7dc1;
7 E& d1 g2 T% A& ^4 p0 t- _2 @  border-left: solid 1px #aecaf9;% c. H# q$ f' C, A0 N. L
  border-right: solid 1px #5679bd;* u, u- U' B  D- i: _9 p
  padding:1px;
: u" \. z5 N3 P$ _  margin:0px;}, [; @# M/ A% F/ {
</style>
6 A% H' G8 W% X1 A- s: ^<script language="javascript">) L& Q# q  F+ v! I6 f; g
<!--7 m$ C# \/ I( q, |; C. K
function rv()
4 w/ {4 C7 f+ B+ N! P  A! s{
8 W7 ^2 P' E1 I0 y/ Z4 U; o  var val="";
8 e, Q: l. Z/ u: v9 j3 S5 G  for(i=0;i<combo_box.list2.length;i++){
5 v. e2 |, f; ]$ f) i   val+=","+combo_box.list2.value;) H! E* |* J* ~8 |+ D: {+ @& P
  }
2 U4 x6 [% b; b4 j& H  if(val.charat(0)==","){
4 y0 i. `- b% a, ?" F# V+ g* V' i   val=val.substr(1,val.length);+ c  J+ ?7 _7 ~- Q8 U4 {
  }4 r1 i  ?& S6 e4 @$ {3 v" c
  opener.form1.frecname.value=val;8 Q8 X9 U+ y, Q' ~
  self.close();, O% F1 {. ~* C
}
/ k; c9 z$ Z" Z, C: ?9 r: T( d7 u, @//-->
, |+ O; g+ R# ?</script>* p( a+ Z3 t; T# H. P
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">  D% \9 m; t! z
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />4 m# [& j! Y/ |. S( o
<%
3 A& U8 x0 P) q; n, k7 d. D. n( M  cdatasource ds=new cdatasource();  //数据联结bean实例
! j- V( Z1 [( C% p% v  java.sql.connection conn=ds.getconnection();
  ]& }/ g. \' g! g  A! y. E  java.sql.statement stmt=null;
0 @* Z8 g+ O, t" ?& R7 w  java.sql.resultset rs=null;
1 y. Q+ E- U* x* D, _  cdatacheck dc=new cdatacheck();
+ `& @. O4 g. n* [0 [# X9 P%>4 P" _. `" E8 a6 K3 u7 `- e0 _
<%5 q' d( U8 Z# f0 z4 }5 Z, Y3 ^
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";- X) y8 R# k4 N5 ^. L, V: c  G
stmt=conn.createstatement();7 v2 h4 ^  {( w1 f
rs=stmt.executequery(sqlu);
5 x$ e  S, V9 V( B) p- ?+ i& R%># y/ t9 e/ h, v' P& p- R# n; I0 R% A
<script language='javascript'>
" d2 X" o6 I8 j. X/ Xarr = new array();. {  ~- P* ]1 u: M5 E' _2 G' U- [
<%  int temp=0;
: x, c3 j2 a: g; M2 |% Xwhile(rs.next()): i- R5 n9 I* q7 ?% R$ b
{2 r4 b. a, |# b: R) P+ e0 m
%>
& N5 U4 T3 A# ~8 A. D* r3 b1 P7 Earr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");9 s2 e3 o$ y) B1 U6 d& I
<%
+ b/ `7 [9 N3 G3 t9 D7 y2 Ktemp = temp + 1;
6 ?1 `. k: r* L) n  V5 _}
: o3 c& q! G' B2 ]%>5 ?/ i+ I9 _/ Z
temp=<%=temp%>;
4 r8 j8 S" n% v, A* h( dfunction changelocation(id){
+ L+ a$ b3 v. Z7 Qdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 # x( a0 E! Y7 O: T
var i = 0;
6 T1 [: ?0 j  adocument.combo_box.city.options[0]=new option('-------',''); ' R% W) h. @3 e
for(i=0;i<temp;i++){
! i& N. g$ A9 c; sif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] " \. c3 p6 y/ I6 f  `3 G" Y
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); # o: T: C# h! w" T- e; H' K
} , R# W2 t8 `( B5 ?) w
} ! x, y" p  j- W% a/ Q% S$ e
} 4 ]7 g+ k6 c- e' Y
</script>+ i2 `- b& `* C/ E8 D+ e% O$ x' R
, D. a8 J9 d( O& v
<form name="combo_box">
. I8 H" v/ L( b  @" ]<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">- T6 p6 a9 V: r1 P3 M: S( \( {
  <tr height="24">! }/ O) u7 _5 b  F' _3 q9 o
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
5 f- S& E# C' B/ ]: O2 h. v8 Q    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
5 X7 q5 t: ^6 T* d+ n* F    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
' e# K) j, f- z& R4 P) P% v" Q    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
) f; z1 l8 u# ?% Y/ `; P  </tr>
3 {! e9 K" i# o7 ~# q  <tr> / j: G2 _* @% |' j& h1 ~
    <td>
; j1 l; s, X3 V9 U! p: C  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
9 e8 L0 j1 h* z5 Z  <option value="0">请选择部门 ---></option>: r1 C8 \# E/ R2 ^, h) z/ G) H6 T
<%' d: A0 {4 y3 S. |
    string sqld="select * from tdept";
6 }7 b% b3 u, K. n* \& Hstmt=conn.createstatement();& p+ {* q7 f( b. R1 g* l0 X
rs=stmt.executequery(sqld);
# C9 q( v7 j) h1 U, Mwhile(rs.next())6 `8 O6 h  P) I: l( C8 k6 l7 b
{
% {- v: U: n) |# |! B$ i! p%>. p# H- }4 W; D1 i; c! D
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>! J. w3 {) F( J6 e( B: U7 D
<%6 _2 x: D0 r  U. P7 V
}. v$ b( Y' \8 G3 b. p
%> ' O2 S3 K& O; h; T. _% P, B
  </select>! h& g' n6 W* g
</td>
' T" G0 Z! {1 \+ H+ t/ m    <td>2 X  }1 j/ c4 c
  <select multiple id=city style="width:150;height:200" class="bgc">8 }3 `- m. R! O% r2 d0 b$ z
  </select>/ \  [  E2 r1 Y; i: c5 F
</td>
2 M* N4 i6 U; X  q1 E$ S    <td nowrap align="center" class="bgc">
- g/ u' z! T* ]" \& k4 Z* _" O/ f  <input type="button"  value="<<" class="buttons">
$ y: Z, I* r# c( i0 O5 _+ w* I  <input type="button"  value=">>" class="buttons">9 a) K# N1 C3 x" T; t8 l
</td>5 _$ I9 O) n- l* p) N' g: D
    <td>1 ]% a8 d$ w" m/ Q: c
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">% x1 J1 x* b$ g6 K* u6 {
  </select>* |  p" ^' O; F. X9 m# W/ E
</td>
5 [+ v4 |1 [# Y( g  n: U  </tr>
$ p/ h5 N, ?( `    <tr class="bgc"> 5 E! ?8 R# R* a+ i- M; t
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>( D8 p  G2 ~& l9 }% a& W; y# I
  </tr>
# f8 o( C. @: q</table>3 ?5 w6 z, g- A0 n3 f( B; A
</form>
" a" w' a$ v# h' x<script language="javascript">7 ~& W9 M9 y' u
//人名移动
3 s( u. }: m& H# \function move(fbox, tbox) {1 @8 A! J# j8 u/ [1 M
var arrfbox = new array();4 C, z* C" F% U' N
var arrtbox = new array();
! o) G( b" C, E% J2 [var arrlookup = new array();$ x- z0 J& B! Z9 T7 p
var i;% V' r  D0 M+ |' |  e8 y& y
for (i = 0; i < tbox.options.length; i++) {
9 b; q6 o. f$ T5 Z' v! ?& m( uarrlookup[tbox.options.text] = tbox.options.value;
/ s( m) G& t+ T! Q4 |arrtbox = tbox.options.text;. a  p' I" ]9 w
}
# ]! C/ z& C0 N2 W: X$ w8 i+ cvar flength = 0;
6 @* B9 \! J! |3 }# y2 M+ nvar tlength = arrtbox.length;3 l6 |  P9 N: Y' X+ W. h' z% w/ B
for(i = 0; i < fbox.options.length; i++) {
* j* j  F, n( i6 n8 T! varrlookup[fbox.options.text] = fbox.options.value;  E  e9 A1 j2 t. }. [
if (fbox.options.selected && fbox.options.value != "") {
' f; r. E2 y. U" @# h; f4 Tarrtbox[tlength] = fbox.options.text;) D0 _  \2 n% P9 b# Z, N4 _2 s# d
tlength++;1 v0 Y. P) S2 S" S# \. T  O8 G8 a
}
1 G3 f% O; S, B7 R3 V6 xelse {! {, ~  ~0 ]$ q* }; ~, p. z
arrfbox[flength] = fbox.options.text;# ~4 B" A$ q+ c, B
flength++;
- E) d& H7 c5 R5 q- a# ~1 S# X9 z   }# b# P' M9 Y# @# n1 d
}
( e& o7 L; w1 u- harrfbox.sort();
1 s4 H2 ~6 N/ B6 ~- Rarrtbox.sort();
6 u( ^) G8 l- _
, G. D5 X/ Z( A: j) Z+ w  u& ~fbox.length = 0;
; L" v, U, o5 T! w$ Ftbox.length = 0;
2 r7 x3 b2 N5 n% i5 R3 Bvar c;8 `. c9 L# J7 I! \/ F/ m6 u
for(c = 0; c < arrfbox.length; c++) {
& @# J* @/ ]* [" J* ~" Q+ l8 hvar no = new option();
' c3 U3 J7 i+ ]3 ^4 Z7 j2 K6 tno.value = arrlookup[arrfbox[c]];; f. s% p2 x/ d- ]. p9 Y
no.text = arrfbox[c];- r" ?4 J* X3 ]9 w; r
fbox[c] = no;$ C5 R% u* u- m; D3 ?$ U
}
$ g+ g6 |# F0 y. ~for(c = 0; c < arrtbox.length; c++) {, Q0 J1 W' W! z6 c6 z
var no = new option();
9 a; G& T7 U7 g0 `( i& Yno.value = arrlookup[arrtbox[c]];
! o4 d* w% L( N- Y" k, W* Q8 Vno.text = arrtbox[c];
+ h; H, ?1 [- `. `7 g$ s* G. Rtbox[c] = no;* a8 Z/ g! ^; J( n
   }
+ z! U* s3 S% C6 D( K6 b  u}
* u8 }! \. w. e</script>
5 V8 f6 P5 N6 X( T" l3 _4 v</body>
6 C6 j9 W: i' K/ P% v





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