Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"0 H3 d, {2 S% q+ ^7 ~) Y9 |! ?
         c pageencoding="gb2312"
6 `2 U- I5 R& A* |# i" \%>
' _) a! E, g  `7 F5 P<style>
$ o! ~: H+ q7 R, q! S. p" h.f9{ font-size:9pt; }
3 t- @1 F$ R* c3 r1 p! B9 p! T.bgc{ background-color:#aecaf9; color: #0033ff }
; x3 Y3 d5 g; b+ |- V.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;0 z/ K2 R8 y" @0 W& F; E% F8 I
  border-bottom: solid 1px #4e7dc1;
. c7 b7 Y" u* l  H( |! o  border-left: solid 1px #aecaf9;) |; G+ H2 ~8 ]6 H' e
  border-right: solid 1px #5679bd;
- C9 m4 M+ J+ Q  padding:1px;
# C9 S3 Y( n6 g1 b3 x  t  margin:0px;}( x  D9 X. u& _! G
</style>
9 T5 R! B( j# v* ~3 x<script language="javascript">6 F, y# g4 H' o
<!--* G! h! t4 U4 d/ I: \8 g8 K7 H3 k
function rv()8 ]5 _8 v! g9 w6 Z% V
{
6 a9 E9 H, c* m9 ^  var val="";
9 j, x7 a5 [* Y! r& _4 t" S  for(i=0;i<combo_box.list2.length;i++){
* |4 O' A1 B1 c# q$ ~( z5 r6 `, w   val+=","+combo_box.list2.value;
6 m' L- n3 ~. H6 c  }  }$ @  I( D; H. U+ _$ v3 `7 b
  if(val.charat(0)==","){- @9 ^4 b& d+ p
   val=val.substr(1,val.length);
& j0 T5 F; V  C+ w9 ?  }
4 u1 M! E$ b" U* R$ q7 ~4 \  opener.form1.frecname.value=val;
( E  u0 w6 h8 O  self.close();$ d) P$ ]/ m' T" L0 `
}+ G' Q: F6 J& T3 @9 H
//-->1 t: x5 n, a3 M
</script>1 b5 R' `: o0 E+ n" X8 d( u
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">- A$ T, F' M0 a* O
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />7 t# S, b; L5 n! ^3 q
<%  G: a: d0 L. I( _" X$ L: O9 e6 ]$ T9 d9 L
  cdatasource ds=new cdatasource();  //数据联结bean实例4 s  B1 z7 K( q% X* j
  java.sql.connection conn=ds.getconnection();
$ O4 h+ l- l; u( H+ C  java.sql.statement stmt=null;; o. h1 J' U# r% y8 _
  java.sql.resultset rs=null;/ q4 O3 {' |* V8 X
  cdatacheck dc=new cdatacheck();  }/ N9 L* c: Z% U3 A5 B7 h' ?
%>
7 s" n9 P* E- ]<%
/ m5 \5 O: x$ N$ J1 }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";4 m+ g0 t6 [1 @3 U) v5 N: Z
stmt=conn.createstatement();* D8 i7 {5 V/ M, L. M
rs=stmt.executequery(sqlu);
% p4 M' j3 Q4 j8 h" o%>( i$ P0 R* u' k  ~) x
<script language='javascript'>
9 t/ W- W% Q- d5 V" _& }" c5 [* l5 iarr = new array();) ^7 C( F. y" \6 q0 J7 u6 d
<%  int temp=0;
9 A& @- H1 ?* f4 k$ T+ wwhile(rs.next()), Y+ Z- f. h1 ~+ G- v! ?1 A
{/ Y" x% _0 g6 ?9 C
%>
3 G$ y( \5 V% D, o' [arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");5 V5 a0 S5 }7 U0 i6 \. i+ T
<%' v# z, v9 }7 R7 S/ T6 Y1 T
temp = temp + 1;
: u: q$ g/ G! F  i# }" E}! F) \( \# m9 R% F4 j+ n
%>
. E0 d% U" |7 O, W! B  ~6 h# h2 J  ]temp=<%=temp%>;
+ c* r: h% c- b% Q* f6 ^5 ofunction changelocation(id){ 9 D/ y! D4 l6 ?# |$ K1 W
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 ( ~% ^4 y6 i2 L7 ^1 y, Q* |+ V
var i = 0; 1 [" r( r; v& ^* n  i6 {
document.combo_box.city.options[0]=new option('-------',''); " H$ k# E) V$ o- a
for(i=0;i<temp;i++){
3 V5 [! J$ D. Z+ c7 j1 o7 d. Uif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
- |& n3 Y6 V1 L2 }0 [$ X+ @document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
; [% `' I" [0 `+ q; t' z}
. O, W$ |9 \( D( ?( n} + ?* N9 \, E5 J6 t! W% a
} 1 t' i5 H: n( e$ @/ k! A) u% ^
</script>! r1 E/ w$ ?$ l. f
" D7 Z: C, m5 B3 g5 r, C
<form name="combo_box">) d% w5 B) C/ M& z; }
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">. U/ l3 E( G* c0 \6 K
  <tr height="24">" ~0 m+ K7 U: I2 `
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
7 B6 u5 k  o" `' \; e    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
4 w' ~" p# {" W. g    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>8 F1 G* A+ V1 y$ y
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>3 j7 L5 r' J/ X/ h
  </tr>7 x% u( Q; w, S
  <tr> / h$ o$ p$ D4 x& V# i
    <td>5 H7 G4 J3 ^  J& [7 n5 ^1 l
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">8 r' f# ^% W2 V6 J
  <option value="0">请选择部门 ---></option>" G  i1 ]6 T8 ?& X6 g
<%7 a; \9 b5 y" [8 B* b% A3 x
    string sqld="select * from tdept";3 h* j, F. a7 a; u3 r
stmt=conn.createstatement();3 y# u: t; x7 X" _% T' {/ |
rs=stmt.executequery(sqld);
4 z' \  d5 ^) F% a0 H: Qwhile(rs.next())
# D- l% p8 b: |) z& A: z6 t{
6 k) r  |" Q" M# m4 C  \" Z%>. x8 Y# L2 Y+ w  x
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>* j: m; l- \; g
<%* @1 x( d  f% U4 M: C
}! O+ g+ C& G( ~5 G
%> . x  x* ?1 b" T7 j* K
  </select>; F# F6 q8 d% D. U: _
</td>
5 P1 h3 u" Y# |$ {6 `) N8 s  `    <td>. I) Q# u( f: E! ^) {
  <select multiple id=city style="width:150;height:200" class="bgc">
3 e' Y+ a9 p% v' Z: _  </select>
4 C! g0 p/ w$ H5 x3 d" `% O</td>
6 I. C! p! F/ _+ k0 G    <td nowrap align="center" class="bgc">1 A, m8 F& Y9 }: _% B9 d
  <input type="button"  value="<<" class="buttons">
( O0 M7 P" |+ i5 ~4 s( ]; m+ L: ]' M5 N, a  <input type="button"  value=">>" class="buttons">3 X1 a+ I, N4 J5 n1 g. k5 F) U
</td>
+ g- z1 N1 l6 |# I& X    <td>
9 K' w* `6 h# B7 j  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
$ Q7 j1 s' ^+ C- ^& E: V  </select>
( m0 W9 B0 ^4 @% ^, n</td>
8 L, B4 y+ N8 x& M) z( G' x$ W5 h  </tr>
* k' X4 l, E$ t( x4 s    <tr class="bgc">
/ J& K' T8 F7 H- i* N; ^    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td># h) s% e! y) ]+ M; a% \% \' k
  </tr>( F3 V6 A4 x' f7 \; \. g
</table>3 `" g2 l& L: Y" q
</form>
+ T" @" [# y5 i* P, |" ?<script language="javascript">
5 _! G7 G/ x% T3 l' H* w5 }4 _//人名移动
" }2 F, H* P# O5 \7 U4 o0 y# e/ Sfunction move(fbox, tbox) {, q7 F6 F4 \0 p+ S8 o# Z
var arrfbox = new array();# _! m* e) L; I3 c& b# a
var arrtbox = new array();3 i" i" Q" V) @' e
var arrlookup = new array();! @: I/ y* z* `# H. d7 t* n" I
var i;
5 k& {6 j7 J* m6 H# f2 zfor (i = 0; i < tbox.options.length; i++) {2 T2 [- c( C, D. R
arrlookup[tbox.options.text] = tbox.options.value;# g/ M" |4 j  X6 ^) E6 r0 L6 |
arrtbox = tbox.options.text;, s' E  H! _9 p" e( u5 Q
}
# n5 n3 P* O, H* Dvar flength = 0;
; R# {2 o/ w0 L% x$ t. Wvar tlength = arrtbox.length;
8 X, a! z: Z7 s8 v5 f2 V* {for(i = 0; i < fbox.options.length; i++) {. x6 ?& `& Z/ p& G4 p0 }
arrlookup[fbox.options.text] = fbox.options.value;& Z+ H% R1 ?( p% U
if (fbox.options.selected && fbox.options.value != "") {
, [5 `( S' e2 l8 v% xarrtbox[tlength] = fbox.options.text;- {; \2 z, l/ O. F! G
tlength++;3 w5 X4 e# s- \3 r5 q( e# c, x4 N
}
- v, `# N* F* z5 o- R% h. d" v8 `- ~( {& velse {) ?: H# ]/ m8 _  }
arrfbox[flength] = fbox.options.text;
) c1 U! `7 \, i1 q% n3 Hflength++;
- @* |- s) g% d6 O  [   }3 m7 l) i0 V, L- V( p
}
0 A% a0 d% X/ X8 {: uarrfbox.sort();2 ]: H- c6 T! {7 S- _
arrtbox.sort();
0 j- z/ y! w" C3 W% `# `
5 X" f) D3 j; U% cfbox.length = 0;
9 g/ j3 A* O) ntbox.length = 0;; [5 g' z0 h: N1 @9 u
var c;2 x; v" A# w; R  A( K0 i
for(c = 0; c < arrfbox.length; c++) {6 _/ Y6 n- a9 p7 W% E4 {
var no = new option();
9 P, {7 x% I8 Q7 ano.value = arrlookup[arrfbox[c]];- W; n8 M9 w9 k' S; m0 d2 N
no.text = arrfbox[c];- [: u, d$ ^  S6 c& R5 C* M
fbox[c] = no;% ~0 ?1 F: O: g  b
}
8 }' W8 V0 l) X! ]8 q, dfor(c = 0; c < arrtbox.length; c++) {
$ B7 d. b: Y( S9 S8 xvar no = new option();
& \0 W* s/ P  E2 Z, B. v# F8 rno.value = arrlookup[arrtbox[c]];/ x5 @' g& O2 E+ K: t/ U
no.text = arrtbox[c];
9 M8 [4 c( y; J8 |1 k: itbox[c] = no;
, M% b$ r& L9 ^$ ?. n* @; m; F   }
! ^9 |& e$ @1 N: C}
4 s3 ]- D  K; q1 b' j</script># E8 h: \" l3 C& R+ o
</body>: R! K6 Z5 P8 i5 z: m7 s, C





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