Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
: q2 Y  T9 A  X         c pageencoding="gb2312"6 K$ y8 D# r) Y; [# J- W
%>
5 F" S# X' w* y9 q3 Z0 }<style>1 s) b6 j1 Z* i1 `0 \. Y
.f9{ font-size:9pt; }/ G6 [  n" y  u5 \
.bgc{ background-color:#aecaf9; color: #0033ff }& @+ ]& ^( X3 T7 |) c% {4 _
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
, v7 ~' }1 ?, J  border-bottom: solid 1px #4e7dc1;8 t; P' _2 p7 X. X( i
  border-left: solid 1px #aecaf9;2 s: m. {5 t5 a! k! A
  border-right: solid 1px #5679bd;8 V/ A* Y/ x3 }( J2 ^
  padding:1px;% D* {* |' W* }; ]5 R: B
  margin:0px;}9 }" Y# w5 i! z0 ^1 x! T
</style>
- l6 X/ p9 d* P) |<script language="javascript">
) N4 v7 D, @# @; V) b5 Q2 d' T; s1 |<!--
. O& s  I# h* a: {function rv()
- d: L, W) i4 M) {% e4 L{$ E# M3 J( C# x1 O# r$ U: k
  var val="";
" U. m: Z/ W: ^" B" U$ u& y8 m  for(i=0;i<combo_box.list2.length;i++){5 W1 d5 B9 W8 j7 n3 C
   val+=","+combo_box.list2.value;
1 y. r% ~7 e* V5 n4 b  }& P2 w/ K0 }  C# o) r. B" D* s$ x8 q0 I
  if(val.charat(0)==","){7 I& V) q; ?8 g5 u& @
   val=val.substr(1,val.length);
# `1 s: q: D# I. O3 o% N  }
6 q# n+ q5 e/ V1 M$ R" X  opener.form1.frecname.value=val;
- n0 ?) |9 e1 _+ R  self.close();% S5 W' {; x3 j+ b$ }
}
0 c& }! |" y. \6 ?( n" F//-->
+ S1 {' y% i+ s- V7 G</script>" ]% p" d" s* @1 w3 M5 d. I
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
. ^3 c6 t* N& a1 I) K2 g<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />- D" y- k  D9 i1 ^: l5 w
<%
  Q+ h, M# p4 ]/ q, v9 p  cdatasource ds=new cdatasource();  //数据联结bean实例
( {+ b  R' q( R8 r$ s" U' L% H  java.sql.connection conn=ds.getconnection();
5 V& ]+ \- |7 H, y* j- Q) D# l: I  java.sql.statement stmt=null;
" B* V, H0 A- E) B  m% A- i  java.sql.resultset rs=null;2 ?' K! m/ M: H2 T: P1 w* M" o
  cdatacheck dc=new cdatacheck();
: M2 t# K# a# h" R; N%>+ [" ^+ I$ V- k$ y: M) T
<%
. b- n& G: A! f! t* B7 x8 q  Sstring 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";
: ^0 c' {% L/ V' {8 ~stmt=conn.createstatement();
6 [& w  H$ q' n* S' e/ B1 o2 p0 krs=stmt.executequery(sqlu);, n, t/ F# I" @- q
%>4 p- h3 H6 W' _
<script language='javascript'>1 q9 f! ?4 ]7 z6 }
arr = new array();
0 ?+ l) o( D: ?  N<%  int temp=0;) b- S- Q+ H0 A( P# K
while(rs.next())
8 t0 x( l, i# r8 v) X$ s9 k- c{% g- G" [2 v6 w% ]9 M6 D
%>
* z( I" A$ X+ _% Karr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
6 L, Y% g7 N) F4 ^<%/ y+ `  r7 `: l$ H
temp = temp + 1;  }4 p0 d( M) d: R. ?1 O) g* W: J
}1 B4 R* o" }! t/ T
%>
2 C% A) n& F2 Wtemp=<%=temp%>;
/ A8 ?3 L6 y8 T0 E# S8 u7 w( u' Sfunction changelocation(id){
6 ?1 Q3 g3 q4 e- vdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
8 X8 d4 N4 @4 h7 `2 ivar i = 0;
4 ?* p$ r( z- l, C% D* j1 s" tdocument.combo_box.city.options[0]=new option('-------','');
) R& G) ^( j% I  _+ ^" w3 Yfor(i=0;i<temp;i++){
6 m$ V6 H0 J' u: |+ r1 O5 dif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
$ W1 i5 y- m5 d  j: L7 D7 L' ?$ Mdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
8 s3 y! r6 ~: n8 d0 ^1 M8 G}
) K( h# y+ }" ^4 v" O, p; Y} + m; c6 b8 C9 k, _
} , H+ F9 ]  c, G- a! ~( U: V
</script>1 X# y! J+ c0 i4 D
. B; Q" X1 ]/ D! d
<form name="combo_box">
5 P! z% w3 m5 a! e: k' }1 o  `<table border="0" cellspacing="0" cellpadding="0" height="210" width="59"># O- c7 {$ O7 n7 y$ d* J: W
  <tr height="24">: ^' v! i% @) L+ K1 v4 J6 a8 @! p7 P
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
- b: [- D9 u) L- z* Z; N    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
! A: N  M. _, B2 T' S8 u    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>4 R# C9 B6 ]6 B1 W- X2 S9 ]
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
# r4 `4 h) p$ O2 m5 j" O8 o  </tr>
6 |8 `5 E8 _$ q" G" U$ }, W. u  <tr> 0 [5 O* V7 Y9 Y( J' }/ ^9 V. \- V
    <td>
, K" h5 v3 p! ~6 b. Y  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">) X  Y7 y" f- T' J
  <option value="0">请选择部门 ---></option>
6 }) L% i* h; A6 ^4 Q# q; k/ q9 v<%
& \1 H! ?( t8 V0 X    string sqld="select * from tdept";4 l8 W: g" f8 P: j
stmt=conn.createstatement();
8 _( v. [4 l' N2 b4 i! B, xrs=stmt.executequery(sqld);
$ W! R$ ^$ K2 @& n- x# p8 Nwhile(rs.next())7 n$ f* q$ n  w: a/ x3 S
{
7 r2 K) u1 e) @$ a6 }/ ^%>; ]2 u/ E9 S" e6 O. y
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>: h; ?* q1 Q: u+ C
<%
0 ?$ T) }8 y0 S. v% {8 ~}
1 o2 ^0 C0 C! X3 v- g* Q%>
* {/ j. h$ n* J" @! \  </select>
2 d) O% q8 ], m  ^# a</td>* \' v1 h5 c: ^; a% U* ^0 c/ _* D
    <td>
, l2 I6 X: Z# \4 U, Z" @  <select multiple id=city style="width:150;height:200" class="bgc">* d6 T9 l$ B8 r2 i  m
  </select>1 g- d  S# J) R2 q) N
</td>  d' {% U7 {  l3 z+ l* r
    <td nowrap align="center" class="bgc">( l8 i: w7 B! o- b( e2 k
  <input type="button"  value="<<" class="buttons">8 u6 C: q+ t0 ]" ?. t4 C# W. _
  <input type="button"  value=">>" class="buttons">
" d; P  I3 h+ z8 e$ y+ K6 ?</td>
# p) P# z2 M4 G1 F1 a    <td>7 D& b6 I! C" P) P
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">" f0 g, t5 S5 ~+ a. m2 E
  </select>
* W  ]# M/ g# [& O$ F</td>3 w/ K7 X; P4 G
  </tr>! L4 Z# I3 r) }& i1 `& A8 K2 w
    <tr class="bgc">
6 H2 o8 ]. f% d  ]5 N5 w% p) v    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>( K! h& F8 \' z
  </tr>
8 z2 x+ U* r8 g$ s5 Q5 z</table>4 A2 r4 ?( o/ j5 J  |+ @+ S+ B8 s  F
</form>- J9 P- o4 n; J. h
<script language="javascript">& I/ w6 I, {( `3 x, T4 H5 ^
//人名移动0 l6 [$ j! y# G
function move(fbox, tbox) {
6 W; l( ~: _( s+ Bvar arrfbox = new array();
6 M% `: x; A* Q. ]2 Evar arrtbox = new array();. c& |! v  D9 A1 ^
var arrlookup = new array();
+ W) I% q7 j9 d; [. Lvar i;
7 Y  K2 l: b5 ]' k! x6 ~' Y; H; [8 u2 Dfor (i = 0; i < tbox.options.length; i++) {* ~0 d' N# Z5 p+ R) G' p
arrlookup[tbox.options.text] = tbox.options.value;: c' P8 ^( L, V4 f. \  F, v
arrtbox = tbox.options.text;
+ p% e5 H) q$ g5 Q- z2 G0 [+ p/ V}7 R$ a9 {2 j, ~& o+ |6 T( c
var flength = 0;
7 D' e& I3 G9 rvar tlength = arrtbox.length;5 M1 ]7 w* Z7 O4 p2 g
for(i = 0; i < fbox.options.length; i++) {* Y- H. o/ H* L  F, }. }& D& n
arrlookup[fbox.options.text] = fbox.options.value;
7 ~3 f: b8 G* E  b: P: uif (fbox.options.selected && fbox.options.value != "") {
0 g; ^: q: h4 Earrtbox[tlength] = fbox.options.text;
. F8 P3 B+ R- r- Ztlength++;
5 R) K, ]1 \3 K; l}( ~6 r3 {/ C. p9 ]* {- z
else {
5 o' a9 s4 A7 s# E+ ^/ J" Jarrfbox[flength] = fbox.options.text;: J1 ]1 _# H. L1 u
flength++;$ |8 ?/ J/ k% R; u; H' `
   }1 u& H/ o) m9 G' ~& P
}# @( u; x" F7 s# Y% A+ q$ N1 v( S
arrfbox.sort();
9 ^( O' D0 ?0 V4 \" r, z/ y" X6 farrtbox.sort();/ \  r( w8 h$ o9 {

/ G7 c2 o# i: ]  U3 r$ y: lfbox.length = 0;$ `' j4 |4 S. L& ^1 Z- Z' w
tbox.length = 0;
4 ?6 l: ?% [5 f8 Z2 ]& c1 Q3 @var c;
* q* l4 W9 ?: V" w% _for(c = 0; c < arrfbox.length; c++) {
2 v/ T1 z( Q- I9 C4 nvar no = new option();
# `0 b0 U) X# [  [! Xno.value = arrlookup[arrfbox[c]];( ~* o% k- B& i2 J' Z
no.text = arrfbox[c];
' Q/ @6 {- u& R" Y4 Nfbox[c] = no;
$ e6 B; K) T8 f& r}' K; c% I  l9 X* U9 Q7 s" c( g) v
for(c = 0; c < arrtbox.length; c++) {* c/ p8 u" V1 {4 Z% O. I0 F
var no = new option();; Y2 ]; R+ v$ u
no.value = arrlookup[arrtbox[c]];
" v3 _. }/ l; W/ q9 s, @. ~$ H7 }no.text = arrtbox[c];3 `/ D, E" l8 J% ?$ L
tbox[c] = no;
$ a5 M- ~5 P% E3 G5 r   }
+ `+ R/ d3 o  J$ |0 ]( s}
. a6 ?2 f: |4 ~/ B" _; p</script>' S! h7 G6 n3 i4 g8 k0 D9 r; L
</body>; C% Z4 Y2 }* u, M  N7 A. S





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