返回列表 发帖

jsp+javascript打造级连菜单

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;". ]# c. \! [7 h+ i& l, F/ S6 F% u
         c pageencoding="gb2312") I& d2 r. D" ]: D/ u3 e
%>' P/ X$ Q: x% J" u% x0 Z
<style>
* _" V( C- T* k( n' \0 \8 P* T.f9{ font-size:9pt; }9 n* A) t# \  |$ G
.bgc{ background-color:#aecaf9; color: #0033ff }; ]) }4 V9 T% M0 x$ T: p. ]( s
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;( K5 G2 o  F: g  I$ l1 }
  border-bottom: solid 1px #4e7dc1;" _3 s& G; P% W6 \( o
  border-left: solid 1px #aecaf9;7 \3 a0 h) t% M6 B2 |+ B
  border-right: solid 1px #5679bd;+ v$ i' n. Y$ r; f5 ?8 C) O
  padding:1px;
) u. d$ S! ?$ V5 ?8 ?( h, {  margin:0px;}
8 G* R% H7 h; q# Q: r" N</style>- S  y* r- ^) ?5 O& g
<script language="javascript">9 I: e+ m- \/ f  ]8 w# f7 p
<!--9 D. C2 q8 S7 @7 v+ z6 \
function rv()
  T# y5 C% _/ z8 u6 A( y{* n# J: A2 Y6 K4 B
  var val="";. o8 w+ V2 d. F: G
  for(i=0;i<combo_box.list2.length;i++){
  P, L4 o; A/ @1 @0 Q9 i   val+=","+combo_box.list2.value;( d; G9 a8 r/ `( m( O/ r& C" a
  }
! P2 ]# p2 u: u  if(val.charat(0)==","){' Y# C' z  _5 f% c
   val=val.substr(1,val.length);$ Z( {' X$ {1 S) P" Q- k
  }
) u/ \' H) C& T3 j7 Q  opener.form1.frecname.value=val;
0 q; E9 A. ]0 y9 B+ D  self.close();* L& ^" c0 E! H/ v: F+ p1 A5 H
}9 [1 q5 p! Y, d; v' ~/ Z$ Q% S
//-->
+ n- Q: D5 F& o8 C9 B' a4 _3 g1 k</script>7 C0 k( L1 f- S0 U8 C" {, o( y
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
2 ~: R+ Z1 I3 E# y9 M' N<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />, g' b; D) K. N* z7 E
<%
& x1 l, V7 t/ L6 Z8 o  cdatasource ds=new cdatasource();  //数据联结bean实例# N1 Z7 J0 C+ a1 i: q5 U! m6 l
  java.sql.connection conn=ds.getconnection();9 n$ L2 @+ |* i; \/ q& \' j
  java.sql.statement stmt=null;
. ?5 e- y$ u6 z* Y  java.sql.resultset rs=null;
( o$ X; \7 o* E' H- b  cdatacheck dc=new cdatacheck();3 `( L% l9 u* V9 y2 J! r
%>
8 a  L3 ]$ c# n, X<%
0 O4 A( y+ Q/ h" L( Kstring 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";% p* V9 i' x$ k! T
stmt=conn.createstatement();3 o' _4 V4 L3 t. D( ?! P  G
rs=stmt.executequery(sqlu);
  w- K! I$ N* y4 d%>2 u+ b6 P  A3 k  e3 B
<script language='javascript'>
0 J6 I& Y: N+ t5 P  p6 Yarr = new array();1 Z6 r& n6 n+ j8 F
<%  int temp=0;
0 Y2 K/ h2 F2 E8 P; Swhile(rs.next())
6 O0 g* Q0 h, L6 e+ R0 [{- p+ ~6 P: v6 ]. {
%>
3 Z& V) `$ G1 g1 karr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");. R' q+ |) n* S, K7 J# U
<%
: t. |: k. B4 Dtemp = temp + 1;; v" J. U" h3 S% o) k( R
}( W' G4 Y. _& V5 P7 L
%>
5 H" {1 o5 s; u, j: dtemp=<%=temp%>;
9 e: C; A( d, Q& zfunction changelocation(id){
" {" D( l0 m$ e, adocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 5 ^) ?: ^) q: _8 t6 L- B! R8 }
var i = 0; 5 _5 Y/ \! H! T5 h9 Q  Y( ~, Z5 \
document.combo_box.city.options[0]=new option('-------',''); & `! r- _1 H4 x" G4 B; u
for(i=0;i<temp;i++){
& v' \3 G4 z9 C8 z4 x4 Z) _' Gif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
/ }$ n6 E) q8 T. Adocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
# k$ U4 ^  s, c' `8 {0 G" M& `9 m; X} 9 I  o( O$ |% G( E' H
} + K- @1 A8 Z: w, u
}
" }( e) Q6 h! ?& a</script>5 {  S( J: _' Z# m% s
5 i+ o/ U- k5 O4 f3 O5 ]
<form name="combo_box">
6 v9 Z$ S3 I, x8 Q<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
4 K0 p, P9 W3 t. i1 B  <tr height="24">
% p$ U7 |' M- u! n- ^  a7 }' I    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>! P2 d# Z4 i0 J7 H- a6 ]7 Y/ d
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
0 X  F8 F/ h7 w2 C. S/ Q# T    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>- v( b$ F7 j2 R+ k
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>$ W; B# @. X5 V  M
  </tr>5 {1 D& G3 }7 m) O1 A) k
  <tr>
' v: l) P/ }% |    <td>
- r. C- ~- |3 x+ k7 @+ k  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
6 [  ~6 a. X1 \  <option value="0">请选择部门 ---></option>
: y& B  z  N/ Q<%
1 ?+ L! j: F- O% v% y: i    string sqld="select * from tdept";
+ _1 Z$ S6 B0 [stmt=conn.createstatement();
- _6 g$ P6 w6 ^' N3 crs=stmt.executequery(sqld);1 a4 k% s( w! W+ z
while(rs.next())
% N2 `0 J0 j  @" f- k3 H- r{" L; V  `/ ]- m. O/ V, U6 R) s
%>
5 _! j; J6 c. j- E% F6 ]) y6 t+ Y' x  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>& {' x$ q3 P' G3 S- Q8 f
<%
- j* G2 _* v. @% u0 C' y& C}( d5 h( ~" w# ~2 s# N; @
%> ( Z  J: f# ^( V
  </select>
; C, H* n+ G' W/ v5 g</td>
) y0 k. b$ c9 O* [    <td>
1 J  `( V4 s% X" L  <select multiple id=city style="width:150;height:200" class="bgc">
  v% q9 E# P: {+ c+ Q  </select>
. t- ?1 v7 F- k, x" [</td>8 L1 G$ @0 `+ v* R$ S
    <td nowrap align="center" class="bgc">& m( Z; m. e! r3 Q
  <input type="button"  value="<<" class="buttons">
6 K' C( n+ b4 V, ^1 O  <input type="button"  value=">>" class="buttons">
0 y6 @! H/ t  K5 x7 Q9 I6 J</td>4 W0 o3 P9 R' H+ r
    <td>
7 @$ y5 Y8 C/ ^, j  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">) t4 g7 ?- M( R% Q2 i+ X9 F
  </select>: d7 R0 R' y7 F: f; y% ?
</td>
2 J- F: d; k8 [+ t8 p- h: i' I! [3 d; V  </tr>$ J) V+ I, X) D0 u
    <tr class="bgc"> 0 ~2 S" S, H- [7 p0 F
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>. B% n1 [6 `! i
  </tr>' o1 d' T. [, }$ H
</table>
1 N( s1 n: {! x  R! F, g; r! ?</form>, p, ]0 a6 l2 |
<script language="javascript">- a7 d2 o5 D7 Z: Q
//人名移动
, v" [5 g. {6 {3 t8 X8 Pfunction move(fbox, tbox) {
  }1 I. Z( C+ E$ z( V$ Cvar arrfbox = new array();
5 l+ R6 z! e& ~& M5 ~. B- R! S: L! svar arrtbox = new array();
8 _3 |" r3 W( L6 ^3 b1 Fvar arrlookup = new array();
8 ^* Y9 @' B- uvar i;# @% Y' ]8 r4 L' }5 X5 E
for (i = 0; i < tbox.options.length; i++) {: y% U8 S1 N/ v
arrlookup[tbox.options.text] = tbox.options.value;2 e$ X) L4 F) z0 J) G# [3 ~% D# V
arrtbox = tbox.options.text;. {2 }) ^# h8 A+ r' ?) e
}
8 @$ B+ D# o/ Svar flength = 0;; E: X1 e" Q2 F3 k& [* S
var tlength = arrtbox.length;7 M. q7 R" q/ c  W- |
for(i = 0; i < fbox.options.length; i++) {  j* ~- I, H) }% y" W$ \
arrlookup[fbox.options.text] = fbox.options.value;. y  [7 q% {8 ]. H* d. c
if (fbox.options.selected && fbox.options.value != "") {2 Z0 Z$ b$ F0 J5 U9 D2 A* H) c
arrtbox[tlength] = fbox.options.text;% d  x8 F$ \3 v" g* w7 n
tlength++;9 M/ b" y2 G7 v0 u' N
}
( Q2 z( Y; m4 _7 n* E* F- Xelse {
% W6 g5 D* {5 H2 Q1 @2 N0 E# \& qarrfbox[flength] = fbox.options.text;
& y- j6 J; m# hflength++;
3 e# m- V7 ~2 R+ `" Q   }" q; |+ F9 r, x# X0 Y
}
4 j) r- [* O, s7 V3 k4 _: h( T8 qarrfbox.sort();
# N0 ~3 O; h& v' barrtbox.sort();  f$ R) O. p3 v( y
: A5 X/ R5 a6 [" r& M# V3 [* v
fbox.length = 0;
. i- Y4 k4 D  Q3 a; [tbox.length = 0;/ ^6 V+ \) A, {5 Y1 l
var c;
! p! _5 U2 l) K) ?" y* j6 K" r' _; Dfor(c = 0; c < arrfbox.length; c++) {
) m; @; C1 I# b$ b7 l2 r4 j# C& Avar no = new option();
* }/ D& v% H- A9 m" P' S- Ano.value = arrlookup[arrfbox[c]];
# G5 q- o: ]& x' P! Vno.text = arrfbox[c];$ t/ `8 o$ V7 B% C' l  t
fbox[c] = no;
% s9 O+ T" K. S8 c7 ]}
9 Q& z( G3 ?# x% q* zfor(c = 0; c < arrtbox.length; c++) {
2 s/ R$ g+ u  o" y2 d: uvar no = new option();
0 m8 P/ G* e4 E5 ]6 [. m! ano.value = arrlookup[arrtbox[c]];
4 c2 H3 p( ^5 {: g$ C$ |no.text = arrtbox[c];
8 c" |$ [  E( u3 Jtbox[c] = no;
% G' K* i5 G" i  t  q# T0 S# |   }+ Z: N1 T% ]7 V0 c
}
$ v9 i2 z7 A: {9 Y$ d/ \1 z</script>
/ E2 X5 E( m$ f: T  ^1 q, m! s" P6 W. ]' _</body>
, {' T& w2 r7 `8 R7 u  o

返回列表
【捌玖网络】已经运行: