返回列表 发帖

jsp+javascript打造级连菜单

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
& y7 g4 Z( j& x; W5 l         c pageencoding="gb2312"
. ]5 }# n4 N) \0 g& T4 i%>$ l/ D3 P  y3 n0 {2 |, \$ y5 n( V
<style>
; R0 U, ^9 c( ]5 \) }8 A.f9{ font-size:9pt; }
0 d. {1 d4 W4 L7 B. v7 _/ W* k, _+ a.bgc{ background-color:#aecaf9; color: #0033ff }4 o0 \1 b* E+ m4 E& V0 ?
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
: q2 Z- F1 f3 s7 S- j  border-bottom: solid 1px #4e7dc1;* H' a$ X6 a& b7 w+ ]* |
  border-left: solid 1px #aecaf9;' P3 u2 \! M" L6 y+ P7 a
  border-right: solid 1px #5679bd;
% o5 C3 D' I1 [* l: _  padding:1px;2 _  |* V8 o4 n) J
  margin:0px;}
! ~3 d) y" b, n1 B$ Q</style>
5 V& L, j$ h# u2 y  n<script language="javascript">8 r5 X4 m; i6 D+ s1 X' M( @
<!--
  f! a: P  l/ Gfunction rv()
$ B* Y& @# z3 U, D5 M) g9 F) `4 b{
' O3 o* e* e: H( e. ]! s2 u( C  var val="";# h6 M. O) ], R1 `/ |8 i. j
  for(i=0;i<combo_box.list2.length;i++){+ z" z8 A' ]  s$ K' V- k
   val+=","+combo_box.list2.value;9 y8 ?% Y7 J6 R/ k$ ~" V7 _9 ]3 O5 C
  }0 X/ U9 i6 Z+ ^0 U
  if(val.charat(0)==","){
; P4 S5 `! `, Z1 \& L% p   val=val.substr(1,val.length);
* g( F' d  b1 ~7 f4 g& n  }/ @- x- L# _; y% R2 W+ ~+ j* I9 B0 }
  opener.form1.frecname.value=val;" I/ `7 a7 n) V
  self.close();
3 b  _; a7 L, X* ~}
2 ^9 l! p9 S( L, H. V1 |//-->3 A: ^2 u1 f2 S2 S. j2 m
</script>
5 E8 {5 r5 O7 u& S<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">0 K8 A/ w1 m+ P- B$ n3 {8 Q
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
" j  D; p$ M1 }' v8 \% j* i<%. \: w( C6 O* |1 J1 z' }, b2 L" J! g
  cdatasource ds=new cdatasource();  //数据联结bean实例
: C! f8 u. \- w" p8 b$ F  java.sql.connection conn=ds.getconnection();
" z3 b7 \! ?* l% r  java.sql.statement stmt=null;
$ f, K8 Y7 p$ i  java.sql.resultset rs=null;
, @7 Q( y5 @! b: _6 A; P$ G' e- E  cdatacheck dc=new cdatacheck();
) F% [' Y# P: P' y+ u%>
" f8 @( C7 b! g8 J" b<%
5 }2 w* X  o4 J6 U. `- Ystring 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";3 ^: N0 d0 l0 k# R5 ?- U8 P% S
stmt=conn.createstatement();
  c+ B6 z. V! W4 H* }rs=stmt.executequery(sqlu);0 J) H1 g/ l$ P  m) \7 U3 E9 K
%>7 {1 @: [3 c/ _8 K
<script language='javascript'># w8 q. |5 p+ O& r4 p9 r
arr = new array();7 ~9 X. a* x7 e. d
<%  int temp=0;0 p; X: P0 x  Y. N
while(rs.next())
4 ^; S7 \( K9 c6 s( n6 B{1 ?- l- S% ?. |, d: S2 ~6 e
%>! M, s, b# j+ E7 t4 f  b
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
3 c( ~* i, R5 O  l<%
! f% c- w4 J7 Z% F$ {temp = temp + 1;8 q  k9 e5 B3 G$ E2 y. `; r) p
}
% K9 j. c( `3 X( j%>" \* V( M# q; t4 G) q! h
temp=<%=temp%>;
" D6 @; v/ Q* N9 n4 ?; V/ x" \, Kfunction changelocation(id){
9 q2 x8 z  t4 R9 v4 b( [document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
) [+ V5 ^+ B/ S) v; Svar i = 0; 4 R* y$ T9 w5 m
document.combo_box.city.options[0]=new option('-------','');
$ H+ b/ k/ Y3 {; Xfor(i=0;i<temp;i++){
) M9 ]3 L0 v/ P  Zif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
1 G# h1 l+ W# r6 j0 [document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
( G, F- {; P! O, q. D2 [} 8 R3 O* Z7 B! w$ h7 X, ~4 y) E
}
1 |1 C* r5 {* V, a- d" G  M}
* `, n. N1 W, A9 F: s' _* X- s</script>
( Q* a  q3 u. ~- x: g
+ c' ]1 J3 J: T, I<form name="combo_box">
$ |6 E" ?9 F4 [6 P1 v8 S6 p<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
+ E  E# v/ z" T9 T  <tr height="24">
; _8 V, h2 ]) J* D$ u+ [    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>: @* T; X: D: _) O0 i; N& U
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
& g; z7 t6 K9 d, ~( m, w5 T/ A    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
3 a. q: V6 U- w. |$ k* b    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
2 s7 Y- A8 E% P- ~  </tr>
" D7 G4 K( \) }: V$ s, v! b7 L* A  <tr>
6 J5 D& M# g' e7 j    <td>
  ^( U" O' ^2 t' l5 f  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
! Y6 r& m5 N) F2 z6 `+ K  j( S$ d  <option value="0">请选择部门 ---></option>
) }+ Q$ h9 `2 k2 u8 W. y; B<%
2 s4 z; I0 F4 `) L! ^    string sqld="select * from tdept";0 u; b' h6 F' p6 U, H0 a* _
stmt=conn.createstatement();
4 K6 z6 I7 b: _+ b! u* u# K: @rs=stmt.executequery(sqld);
! U- d5 ]2 L6 l) T, gwhile(rs.next())
) c9 T) D  c7 Z; G( G7 O( X{
$ Y  `. s, t- B. l2 _%>
) i) S) I+ t7 z. G4 E4 p) Z  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
. \' |" Q! u2 N9 H$ `7 F<%$ H% K9 X2 u7 b, i& F
}. g- ?+ P" C8 O- q( l9 G: c
%>
4 v1 }% n6 o8 H6 v: f$ k  </select>' ~. V* A1 S1 R6 \/ K5 g6 D
</td>8 |0 X* p' V. R. t
    <td>( M1 Q4 B' d; X2 O+ H& s1 L; o! L
  <select multiple id=city style="width:150;height:200" class="bgc">4 c: `& j3 ~  e# C$ a8 `
  </select>2 j* c* Y8 R7 L' R$ d/ `
</td>
( f- h/ ]% L& `& I" G% M    <td nowrap align="center" class="bgc">$ [; Z' T5 ]6 O, R
  <input type="button"  value="<<" class="buttons">
7 F' h# t% ~; m' v0 `8 W  K& j  <input type="button"  value=">>" class="buttons">  [. \( O  l- V1 @# \
</td>
( R1 l3 l4 M" B0 i& Q    <td>. u$ b$ \( a1 p/ _. D+ ^3 S3 o" A
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">/ \* f9 ?0 s3 V* ^+ Q2 A4 c
  </select>, O! S- X+ @  o5 p8 E! `
</td>4 p, l' @& t( e$ O+ {
  </tr>3 }# f- `7 y- \$ a, y
    <tr class="bgc"> ! T* @9 r2 C( W4 g; s! v
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>7 j+ V) f% b: t" [9 [5 `
  </tr>( K9 i1 w0 e4 I( g8 q
</table>7 y9 S9 g, W  L) l: W2 @- s% y0 K5 w: n4 I
</form>
& g* b% F: I* I& u<script language="javascript">) }6 h3 B* p$ e, H% x2 T1 ]# z5 M3 T
//人名移动
( i" }1 @* v+ v2 g8 O- ]function move(fbox, tbox) {
2 G9 b  f% U4 y8 Y! c' uvar arrfbox = new array();
: v: b2 J) Z3 K' K; x" dvar arrtbox = new array();9 d3 L' I- R8 M6 G3 Z7 g: p1 N
var arrlookup = new array();
  d8 n, ~+ Q, r% a  M! Jvar i;+ X6 d! {6 @: g( v  m. F
for (i = 0; i < tbox.options.length; i++) {% C) x8 `5 X& }. _% J& ]
arrlookup[tbox.options.text] = tbox.options.value;
, p: g/ C$ J7 V6 X" s7 {7 \. H- Marrtbox = tbox.options.text;/ \7 n6 g( z$ x* f% r2 \9 ~
}- e9 _( {, W8 o4 ]" o$ `( j
var flength = 0;
, v8 M# d& W( d  P# S2 u" Q$ }: V# dvar tlength = arrtbox.length;
/ A( ~: O; Y1 c9 a* X" ~( v3 Pfor(i = 0; i < fbox.options.length; i++) {
# g# l1 |+ d% H9 ~. Oarrlookup[fbox.options.text] = fbox.options.value;
. V$ ]- R, c* S9 k. {$ xif (fbox.options.selected && fbox.options.value != "") {! m/ o3 q1 I0 j6 i
arrtbox[tlength] = fbox.options.text;6 o. Y. I5 `8 \* u' _# G5 i+ D
tlength++;6 m* p. @4 R2 z6 S0 ]1 P
}, H4 Y1 e) e# d$ X" A' A0 G, p
else {
" [( K1 S- W2 T4 b" Rarrfbox[flength] = fbox.options.text;
: r1 v) |3 b# ~! A' `6 r8 ^# jflength++;
5 U/ A( A4 a4 Z0 Z. y+ F& [; L" G   }
$ T) W9 x7 P0 Y" ^2 a}- I) F0 T0 v9 P1 N3 K6 l* [2 q
arrfbox.sort();
0 r1 p( J+ g; \: @8 L* X; Varrtbox.sort();+ c8 b* ~  K+ F
, N' U& W& P  Z+ B4 f" @' y3 w1 R" t
fbox.length = 0;
% J/ B5 B2 q1 |. e4 I' ~tbox.length = 0;
; u  v. ]/ Q- s; i) C% gvar c;
3 u9 K  x* {* B0 M  f/ \7 q; G9 tfor(c = 0; c < arrfbox.length; c++) {  I; c7 {  }* k4 i  V
var no = new option();0 u: _. @4 Z' e, e0 {  w
no.value = arrlookup[arrfbox[c]];4 a% D* ~8 @/ B$ l
no.text = arrfbox[c];$ K' D, W% Q: c) E! i0 A9 P
fbox[c] = no;+ w# ~8 M$ u7 }
}
. r; c3 D8 M9 h* P# c8 ^: c9 ufor(c = 0; c < arrtbox.length; c++) {
4 K) f$ A, e& i9 t+ c! _3 ~9 yvar no = new option();+ ?% P/ r1 N- B& [
no.value = arrlookup[arrtbox[c]];5 o: _. q& T" e. d+ W  t
no.text = arrtbox[c];; P" H* ]$ P' j5 j$ a3 T
tbox[c] = no;
- ]7 d$ L* D5 @: w  G   }
( z& ]$ X+ h! a3 a3 A3 s}$ u5 I$ b/ U% {8 `+ N& V
</script>6 B, M( D4 i) }3 o/ l5 O( d0 G$ n
</body>2 u! l, L  Q& d$ K0 P9 ?) N, T

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