jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"% C1 p* |( w2 ^" f
%>
<style>
.f9{ font-size:9pt; }
.bgc{ background-color:#aecaf9; color: #0033ff }5 b9 p( ]  j) c9 U, T
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;* @1 [: o4 F& F, r* i8 c
  border-bottom: solid 1px #4e7dc1;& Z  u9 G5 ]) F! f, d, Q. }$ D  c
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;
  padding:1px;* ^: t+ t# Z0 D- J8 g- A6 I5 P+ t
  margin:0px;}* i8 |6 S6 A% I2 Y5 ~
</style>! j3 ~; B" Q7 T: O1 C9 S
<script language="javascript">
7 r0 g5 z+ P8 P/ y. J/ R* x
</script>
, B, ?3 N* g) U7 t: m$ q0 Y& q" c3 B<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">/ e4 v4 D0 R" J
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />* \0 S; D7 g3 D% H7 N, m
<%1 u1 g2 I: g2 T0 b9 ^2 G
  cdatasource ds=new cdatasource();  //数据联结bean实例; i; S' t6 R& B9 @# a
  java.sql.connection conn=ds.getconnection();
1 ~" E" G: E- q) p  java.sql.statement stmt=null;
9 h( ~) M! E; f6 j5 @2 x  java.sql.resultset rs=null;
4 E: p) ~( @( X. {) k8 V+ ?7 V  cdatacheck dc=new cdatacheck();
6 j& T' M4 ^( M1 D+ w. q%>4 a' L, G! o3 B
<%) s0 ]. y( M+ z6 ]  p2 {
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";
2 e, f2 \) p$ S& Z( j0 vstmt=conn.createstatement();
& N: m1 n1 g5 X# h+ Irs=stmt.executequery(sqlu);
& C0 u( \& M- D+ \/ f, i) t. Y7 u+ G' g%>
4 t8 o# r# ~9 ~<script language='javascript'>& v) Y0 `9 k; c) }8 B' a& o8 w: Z' _
arr = new array();. b- R! `0 d0 s5 P2 a$ J
<%  int temp=0;9 k0 h; m) |5 @# m
while(rs.next())/ I# g+ v7 c) `" ^/ Z
{! h$ B3 u; A+ ]$ q% [. v3 B0 m- U
%># X2 q/ N1 d9 Y. A" E/ G! L
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");& P7 J' U2 J- p% Q$ O( Y5 Z) r
<%
* l! t; E2 y; L- Ztemp = temp + 1;* q+ |  Z- w. t0 {% A+ S: m
}
% {1 w8 z/ Q$ v4 B( N%>
1 t1 u. B& n) q/ d; R2 l& {& Stemp=<%=temp%>;
  S, A& t" W8 u" f7 ~" S" ]function changelocation(id){ 4 T6 U! u. ]; X' A
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 # A' e, s! x3 y. _2 C! Z0 O' ^
var i = 0; 9 R5 y" k1 E+ Z* s+ W! \7 P
document.combo_box.city.options[0]=new option('-------','');
/ p* g9 _7 w; n! a/ O. U% Afor(i=0;i<temp;i++){ $ Z4 X! [5 i* V3 j5 G: @# q& B) a
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 5 f- U- j( b8 J0 o
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); 0 U  Q0 D1 L$ U1 _; k; V. s9 v
} # o5 R% j) \: n( s  K( f: G. [: H
} . Y" P# G+ L; X, n) s" [" i% _
}
5 ?. B3 }: T3 P' w9 }</script>
* @: x! f4 {! D2 O* ~  j
1 p$ Q; i$ x- V& Z6 V$ _- Y2 _<form name="combo_box">
$ M+ U2 ?$ m2 O9 ^<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">8 P9 ?/ e: B& Z+ C8 n* q" c
  <tr height="24">  T5 u$ }5 \5 b- [
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>; o1 E/ c1 |; E* f4 _2 ~! x
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
( P" d+ X6 I* K  t3 I( Y2 S <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>3 `( j; k1 Y/ P: V' t. P  g
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>$ U9 U/ c" r) H. |
  </tr>
9 m) R1 `! [0 w* K* ]; M6 \0 }  <tr> - k, _. |% _( g8 c, T' T
<td>2 k; W% T9 l0 l: {3 P
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
( W# g6 j$ ^9 ^* d) H) B  <option value="0">请选择部门 ---></option>
( N% T% t# x' ]9 Z: |+ g<%
' k+ x0 L! ^/ O/ _+ y: c string sqld="select * from tdept";% K. m  F# k7 f
stmt=conn.createstatement();
1 u5 D; n* g3 b$ j6 G4 Prs=stmt.executequery(sqld);
/ Y2 A1 `- l+ I$ h) w4 ^- Swhile(rs.next())
7 ?- P* Y' A* y# T) F4 _! U{6 e2 z1 a8 E$ D) J
%>/ R! d  z+ p! H7 L& Y: w8 o
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>8 y% r# S6 t8 q2 E6 z; W4 V8 b
<%! z* j* t1 x' J% L2 a  M& v
}, g* G9 y- o5 I9 i, h& y
%> ' C6 Z3 H1 Q' x! |) V2 m+ }
  </select>0 a1 K& Q+ g+ P+ B
</td>
4 L! r1 }! N" D6 J# d% H: }. J <td>
# g9 @1 ]% g; H0 z' |  <select multiple id=city style="width:150;height:200" class="bgc">
4 j7 ^! J1 C+ J! ~$ L* c  </select>( S( `; Y6 q) y& ]$ C1 Q
</td>. H# D; R% o4 U5 j% U% q$ A- \2 _
<td nowrap align="center" class="bgc">5 C9 z3 ]2 n2 f' |5 x- I! h
  <input type="button"  value="<<" class="buttons">* `3 P" ?) M7 _8 |0 Y0 I6 Y1 u
  <input type="button"  value=">>" class="buttons">7 [3 z: W. A: r
</td>! K& p3 b5 ]4 |4 Z8 }* S
<td>5 v1 N5 F* F. ^0 a# D
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
  V: k2 g3 @- O9 \& l, ^9 d2 ]  </select>
2 |9 e' y* W: r1 c; s' i  b</td>( k6 D1 g" j+ O# ~, x' R$ c( W
  </tr>
2 G. f& L1 z+ x- O7 \ <tr class="bgc">
  ^5 e+ P7 r  U <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>6 S$ L% z4 Y( ], q7 s+ Y5 D9 @
  </tr>" C4 G! S! g& V! n# Q/ j
</table>
4 F: ~+ a, B( v2 M4 B* |</form>9 ~$ M0 g9 h5 o! b5 Q1 b' I
<script language="javascript">
, G) N4 M, [6 ^//人名移动6 ?( p4 \6 l( B/ w
function move(fbox, tbox) {
9 a, r! ~& K; uvar arrfbox = new array();! Z4 T! B7 g" t" r* J
var arrtbox = new array();3 r7 ~9 a, g! U& b1 \! `4 E; n
var arrlookup = new array();, R6 u! c0 t7 R* W# h
var i;
; n, B3 E; e/ N: _4 Y# v  A2 u- Efor (i = 0; i < tbox.options.length; i++) {
" |; P9 S* e4 garrlookup[tbox.options.text] = tbox.options.value;
. p( }  }( d/ \4 B% Varrtbox = tbox.options.text;9 o; P3 I/ @* B8 P: F) B4 H$ c
}( J  ~- z% I: n& ]% h
var flength = 0;# j/ z" z, f& `; a
var tlength = arrtbox.length;/ e" t7 U" E4 j3 Z) {/ R) H$ V
for(i = 0; i < fbox.options.length; i++) {+ Q2 E1 G! |2 X& Y/ T. B+ a
arrlookup[fbox.options.text] = fbox.options.value;$ Q4 O# z2 z( }
if (fbox.options.selected && fbox.options.value != "") {3 N/ S% U' [9 V" u/ h! Y, ]( u
arrtbox[tlength] = fbox.options.text;7 y, B) C/ o, D( D+ j- S
tlength++;
" l+ [1 h, W' R% [7 R9 I}3 p4 B) K' F5 e
else {' B: Z: U% z8 g/ Z; K" A5 H" j
arrfbox[flength] = fbox.options.text;
+ v8 Y5 F1 Q% j5 z. W8 {flength++;4 z0 J4 H" G# ]
}
# ~' q, Q. G; _+ s- U3 K8 e5 `5 O}' O1 @6 `8 r7 S
arrfbox.sort();
  a- }# `4 l/ E9 ^, e* s3 U3 d3 p( Earrtbox.sort();
% B# [' g9 `. Y0 f
2 n2 y0 C# w8 H& C, o& V4 `; }# e' yfbox.length = 0;3 J( f  O6 x9 h, G3 ?4 ]( @: E
tbox.length = 0;
$ {- ]1 p" o' W. H: cvar c;# G$ \" T7 z' b- D# U
for(c = 0; c < arrfbox.length; c++) {
/ [1 [: e, V4 x. I1 b' Lvar no = new option();* m# g5 g: w' B5 D% g. E; H
no.value = arrlookup[arrfbox[c]];
4 G9 ~* F$ O- G5 W7 \6 \0 N) ^! Cno.text = arrfbox[c];, F3 _- p' i! ?3 D4 E9 ~
fbox[c] = no;
& j! E! R1 I4 A" O}5 i1 O8 A/ L2 C2 U( g
for(c = 0; c < arrtbox.length; c++) {" Q* F5 V1 a, P1 |# Q" Q5 E6 K
var no = new option();+ ^7 _+ @4 T: h( [
no.value = arrlookup[arrtbox[c]];
# \9 u$ x2 y2 x5 Z6 f8 D+ eno.text = arrtbox[c];
: s2 j- K+ V3 l% Wtbox[c] = no;
* t" }& P+ E/ W6 u% V }
6 F; @$ \9 M$ H/ S% C0 m" x}
6 a0 u" R( m! L  ?</script>( a0 h1 |; U. {7 o" \/ [2 f- ^
</body>
- S$ @/ H' V6 ?

捌玖网络 89w.org----致力于站长学习交流

返回列表

jsp+javascript打造级连菜单

[收藏此主题] [关注此主题的新回复]

[通过 QQ、MSN 分享给朋友]