Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
5 S3 m: }) K' |, Y$ F: Q! K) a         c pageencoding="gb2312"7 C) i: c1 y$ ]- [8 ^' q
%>
0 l, d4 @+ {0 ]<style>
& {$ {" I7 M& K4 Q7 Q+ t% Q( D8 c.f9{ font-size:9pt; }
7 o# e3 e- ?* K3 Y9 M9 V2 H1 ?.bgc{ background-color:#aecaf9; color: #0033ff }% }& Q9 j6 }( Y) u/ J* L
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;/ r" D5 O, c" A
  border-bottom: solid 1px #4e7dc1;
% C% }! ?, e" Z' ^  border-left: solid 1px #aecaf9;: L% {- q+ _0 i% ^
  border-right: solid 1px #5679bd;
3 I5 A& {$ e+ S/ v  padding:1px;5 B% A) j9 Z8 T+ C
  margin:0px;}! n) `: d6 [( t; _
</style>6 j. a9 n4 m4 }' ?1 S
<script language="javascript"># y: p" z( G/ M: H7 R1 Q2 d/ C* A5 P
<!--
6 ]2 Q/ E" V* |function rv()
7 O( \) C5 w) T* o6 j0 {, @. n{0 p) B" N1 D' N6 f& J' R
  var val="";4 L! L- O2 O- |8 f5 [7 `
  for(i=0;i<combo_box.list2.length;i++){
. w+ c; F0 z$ \* A1 K+ ]) r3 d   val+=","+combo_box.list2.value;7 K  V/ A8 j( g) `
  }& I( D  V% G0 q$ c$ I
  if(val.charat(0)==","){' h7 N2 h' E9 l: U4 J( N3 B" n
   val=val.substr(1,val.length);! |1 ?; x" i5 B0 X1 }
  }) E* A4 Q! P3 j- Y  O7 G& W7 V
  opener.form1.frecname.value=val;5 V4 i- w2 k1 E3 s. y# h
  self.close();
2 y# G. F3 q0 S$ J# r$ @" a}
" t5 Q4 m# Q7 T$ w$ k//-->
3 a* u5 K4 |# g2 u1 S$ B$ J</script>
' i* u0 T! H8 c( C: T5 L2 F* R<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
' J( u% q7 h7 r/ O3 X<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
8 q2 r0 w$ g3 P- R5 {- c+ j$ ]% j<%( q: p$ j6 W% r. v# j
  cdatasource ds=new cdatasource();  //数据联结bean实例5 N( J" Q1 `8 m5 u: j' @/ q
  java.sql.connection conn=ds.getconnection();* ]% x2 |: Q# Y  Z
  java.sql.statement stmt=null;
1 Z8 \: r) w0 @7 e" G6 \  java.sql.resultset rs=null;
+ v2 ?1 \/ c0 H2 B3 f+ A  cdatacheck dc=new cdatacheck();
: X) G2 a8 W6 U%>( Y$ R8 }& c) X. S/ Q6 Q
<%. G- z5 O$ {, R* ^9 x3 ~
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";8 H# }/ m7 @4 z0 T
stmt=conn.createstatement();
8 D! `( i% w4 ^! i+ p  [1 krs=stmt.executequery(sqlu);
- B( ^; s; ?6 h) s, x%>
. \6 ]; v. f* R1 k! }/ [<script language='javascript'>
6 |! q" F3 A. @/ [7 {, warr = new array();
1 N  p! p: J# V( y9 a7 {4 [<%  int temp=0;
* v% u" Z8 @$ h' F; Mwhile(rs.next())4 _- X- r1 l0 f! n- N+ h6 V
{
8 D$ z+ |0 R- a8 X1 a%>* y2 ~" P8 P7 W2 @: N
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");, k3 |+ g+ g/ S6 h3 w" U/ Z
<%$ _1 K, l3 i: X! `2 C' X
temp = temp + 1;% `% p" l9 |6 ^$ F9 V, J  D) F; D
}% g' ]6 \9 d8 [8 q* z' ]; [
%>
; D' O3 v4 a4 k  etemp=<%=temp%>;
% I# ~2 H- G, R1 M. R2 Gfunction changelocation(id){
* E& Q, d" e8 q& a+ Tdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
0 V- @1 B' ~8 U3 `var i = 0; + Q8 r5 B2 K/ Z+ s- z
document.combo_box.city.options[0]=new option('-------',''); # w- A1 F6 l8 x/ m/ M( Z/ c" L* ?; C1 F3 ?
for(i=0;i<temp;i++){
' ?& Q6 a& \( x/ A% F% E( Dif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] , F+ t* k8 j& X/ B6 ?2 j0 @
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); 4 Y6 W6 R" ~6 ~+ V- b* e
}
  q2 y1 I9 ?# Q3 S' L0 e} 0 M$ s9 Z9 X5 [/ [
} 7 Z) j0 F2 p( M0 w- v
</script>
: _0 Z  y. r! l
% n+ y. o; H; o$ ~<form name="combo_box">
- A: L/ A2 k( O) `1 I+ G<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">* C9 u( h. u1 O! \( k) }* x
  <tr height="24">
; s* }7 h- h1 d$ A; ]5 F- [    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>1 i: i; E0 u; _, m- @
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>+ J; Q. S& Z+ i! ]5 h5 k
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
& C  \% e3 a9 _" x* O* b3 ?) x    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
: _  ~9 v3 R% z! s$ _. U/ a8 F  </tr>6 ~, Y( [7 [# I/ Y* N: i6 s
  <tr> ; G* \, t% z- X0 |7 Z
    <td>* v  ^+ X$ V0 i% C, c0 a
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
& d/ t7 V2 Q# i* |& G( r. R  <option value="0">请选择部门 ---></option>$ |: ~, ^, X) O2 |
<%/ {! u4 G! {6 d) L2 K" c
    string sqld="select * from tdept";: r# d& Z! Z5 y2 m
stmt=conn.createstatement();: e$ p# j- o) d! |
rs=stmt.executequery(sqld);2 ^5 S4 ^  g% j2 x' _. q: ~
while(rs.next())8 _1 ^: Q& v, u8 ^
{
# t4 @+ f1 l" k. R5 a" p& M# S%>7 a) [9 L* E, }& p1 Z' s
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
: z, A6 G. N$ e# `1 a( R3 }<%
2 K; m8 @4 S. c  y% |}9 Y3 c& \8 }; ]9 W" i, J) W
%> & X- g* M( _4 t; J+ N( k. O, a; C
  </select>3 k. l% s- p8 X& `( _
</td>
  g9 k" r. @6 p, n    <td>- [" @" p, F, S2 k8 Y
  <select multiple id=city style="width:150;height:200" class="bgc">
+ b& P3 `1 c1 t% O  </select>% Q$ _: U1 `! i$ T" w7 e# ^- N
</td>5 M6 e: j& [/ T; K( ^
    <td nowrap align="center" class="bgc">
* t" L9 l7 S! q5 \3 u  <input type="button"  value="<<" class="buttons">
# E/ u0 a% E& w  <input type="button"  value=">>" class="buttons">
1 y9 o; `5 w# R1 p4 B</td>
  `7 g* i. o( ^* }    <td>* n$ b4 B' o1 z) Z, l0 X
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">$ {! x8 t) q; `  I. C$ ^5 N3 I
  </select>
0 a" r# n2 [( R/ `4 ~& r</td>" s5 I5 y: v/ @/ F: a& j
  </tr>; d$ F- A) o% n6 \- v: }# d: M9 [; N
    <tr class="bgc"> . @0 n6 k# b; `8 {  }
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>6 S, R! n1 |0 s% d2 Y7 [
  </tr>
2 p! E) ]( a/ f+ a</table>
+ x; u. N2 l# F. n8 o. S, S</form>
: t/ h! C+ \7 g3 n; ~! f8 U<script language="javascript">/ q* y. l* T* C+ ~
//人名移动0 V% p9 b2 b# y) M. o
function move(fbox, tbox) {) \/ r+ i" B6 p' }1 _( N- \% [
var arrfbox = new array();% z# D8 ^- b  x% [( U- X
var arrtbox = new array();
: F: a! Y! S+ Qvar arrlookup = new array();
2 }4 Y5 h6 d% R; i( y3 Fvar i;
( Y, _9 [1 W/ @for (i = 0; i < tbox.options.length; i++) {
( ~$ N1 @( f  d8 m& S. {arrlookup[tbox.options.text] = tbox.options.value;
% I* y4 q& h$ U6 g( K- }4 \7 Narrtbox = tbox.options.text;
% Y; m$ i" j0 s}% x8 M/ p$ @! T7 q
var flength = 0;
1 U8 @. C7 @3 a# Vvar tlength = arrtbox.length;
* e0 R9 i' {) x- f8 ^2 K7 Lfor(i = 0; i < fbox.options.length; i++) {3 v5 x6 Q( P$ Y$ i0 T6 p
arrlookup[fbox.options.text] = fbox.options.value;! ^' G5 ?  J8 y  C& h( a
if (fbox.options.selected && fbox.options.value != "") {4 r/ U1 J6 e& f! S3 H
arrtbox[tlength] = fbox.options.text;
5 }  S: O% a9 ftlength++;2 U/ f% o* j" c4 Q# C2 K) M: [  J
}! ]7 d6 N) j9 J! M; ?
else {1 w0 s+ A8 c3 h# G6 J# N" \8 Y4 w
arrfbox[flength] = fbox.options.text;: R: d5 Q7 \7 M$ G* A* x* Y
flength++;( s. H0 h. v  V2 H* h
   }8 H% J) c+ h7 \  G: _4 _
}
! r5 q6 P- J& T% a, I7 |$ L5 Garrfbox.sort();" m1 B0 v6 M" G. J
arrtbox.sort();; `& Q% z+ l6 V1 l' b- c0 b% A

2 l1 }6 H9 H3 e5 C/ A3 Nfbox.length = 0;( |+ x) I6 e1 I6 n3 k* R! d
tbox.length = 0;3 z# A" p: D2 Q( U& E! {6 t+ M, I
var c;
3 ?' b( {# e; S% Z% M$ R. Z7 Tfor(c = 0; c < arrfbox.length; c++) {2 v: e( e& r, ~3 l0 D) \9 |* @
var no = new option();
0 v$ a, P& m8 w: kno.value = arrlookup[arrfbox[c]];
8 _. ^9 x; S% N' h& Hno.text = arrfbox[c];% F2 s; n6 z" l& N* L6 `
fbox[c] = no;
9 r% ?% [, U  |  D}, t9 W- k2 W# p+ I3 W8 {
for(c = 0; c < arrtbox.length; c++) {
# Y& r1 R" W" Q4 xvar no = new option();
3 m) r8 h$ o/ h9 N9 G3 _7 ?! \no.value = arrlookup[arrtbox[c]];
9 \; s3 y5 {3 d- Ino.text = arrtbox[c];
% B1 ]' m$ _7 m6 U2 r3 wtbox[c] = no;
- ^% _. U4 S3 ^: C! O* N8 J   }
2 G4 |% V( [0 [}' x- ^* h; t- J. [8 D( |# j6 k3 y
</script>
* h9 f& l% {4 l2 c' k# h</body># |8 Y7 {7 {3 G) f5 m1 r1 H8 D* F





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