Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"  S" D/ S% J6 g" J; ?) n+ |
         c pageencoding="gb2312"/ j% y+ l' c/ b* R$ G. p
%>
# m# f! F% y/ F  R8 S<style>
& a  B5 ]" \3 C+ `5 i# N.f9{ font-size:9pt; }
& q7 \7 }% s5 J2 G# q.bgc{ background-color:#aecaf9; color: #0033ff }( c, {* n9 v+ W
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
$ }) X* I- y6 [( z5 F, B  border-bottom: solid 1px #4e7dc1;4 ~7 s% N2 \# `5 t2 Q, |  B/ p
  border-left: solid 1px #aecaf9;
6 `; E2 L% r( y& P  border-right: solid 1px #5679bd;
& F+ {) I+ K8 @! B4 ]/ z  padding:1px;
7 \9 T/ X' @8 r  _6 \: W% E5 @5 k& x  margin:0px;}+ l- s1 y5 S# E7 U
</style>
5 `& [. v6 @/ T" o2 z<script language="javascript">: O  [  [3 Y9 Y9 J4 b8 {
<!--' N9 i- d: q: S# {2 E7 Q
function rv()
* }  x8 L- ^7 p! I& P8 [2 O( ?{3 h+ p2 L7 u4 q) C
  var val="";
( V9 K' T' ^8 I/ N  for(i=0;i<combo_box.list2.length;i++){
/ K) B- `7 x; `$ ]9 W   val+=","+combo_box.list2.value;# z3 B7 \8 B( t( A! Z. J+ A3 O
  }+ E5 u' ~9 Q" _9 ]1 i& d
  if(val.charat(0)==","){
" T" f* _1 D$ c. K# k* v( E2 I   val=val.substr(1,val.length);
1 f& B/ S: l' x9 l  }
9 d' k1 \$ P! w5 g+ q2 N9 H. E  opener.form1.frecname.value=val;
$ f: a9 n6 V* |/ l2 ^  self.close();
/ T0 D4 N8 B( e, ?; `. T# p5 Y2 f}
  s" B% J6 C0 c& r//-->) U* a# s# C' F/ P9 _
</script>" w7 |+ t# l1 B; S: W4 i
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
7 @. f. G+ k5 u. p<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
$ a) e( A& Y5 [; m. X+ p6 V7 D<%. k  {% |" [, _+ ?9 o  ?7 d) N
  cdatasource ds=new cdatasource();  //数据联结bean实例% C" W$ V4 b% p3 E! _9 E
  java.sql.connection conn=ds.getconnection();! R# l% @' [% ?" S! Z# O
  java.sql.statement stmt=null;. ~# w% E0 y5 ]; Z+ f& H
  java.sql.resultset rs=null;! |. Y$ D* G9 k6 h! f! [1 q
  cdatacheck dc=new cdatacheck();
8 G1 M# G: T! v# j) e%>* m% y! |. ?/ k
<%5 Q* f5 i& s: h) h1 g
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";( ]' ^; E4 e* f2 ]* X) V
stmt=conn.createstatement();( ^$ X1 x& e4 P9 y6 I& Y) _( t
rs=stmt.executequery(sqlu);( S+ P1 M! o9 e1 S' t3 y
%>0 U- k* ?* f- Z- }8 c, q
<script language='javascript'>) S- D/ j5 F$ H
arr = new array();# w, ^  O; D* ]2 l. U7 E: U
<%  int temp=0;
# e  x2 a$ o# B5 r3 ^6 f" {while(rs.next())
& l4 k% K  p. F0 L# A{+ s! Z( f1 t$ P' I4 i1 h
%>6 R. Q* C1 H9 I' Z' h- |1 J) i
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
/ q9 ^- }: w  ^# c<%
: k/ o- _4 f0 q' \$ c0 n5 Itemp = temp + 1;
& K+ V( f; F  r% J* H}- {( Y/ c/ [. L3 V( \* Z  s
%>
& o, r. `% J; y# b9 A3 j8 @; y8 etemp=<%=temp%>;+ G7 S1 `' ]5 Q1 O- ~
function changelocation(id){ " a, ~; b  U. L$ b1 g: }& h+ U
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
- a. W! [& ^+ {$ N. Q$ ~$ evar i = 0;
8 V) ~$ D% G8 T$ u/ `: y) ^4 Xdocument.combo_box.city.options[0]=new option('-------','');
4 O. a/ R) b& j6 k9 j0 ?& ?$ A" ~for(i=0;i<temp;i++){
4 C5 c. s  A# O% Y2 _if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
+ D4 y7 v$ r/ C, x2 cdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); * J, y; a' `4 ~( U( \" K
} ! g! P' l$ g4 n/ N7 c
} 1 M7 Y3 O- n4 i. N! k" A* o5 \
} 1 l( I1 J+ M: x% }
</script>/ k! Q9 n. j: m% r: C

# [( l0 W/ ]6 U) Q( i, W: q<form name="combo_box">3 u/ a2 Y0 _8 m4 w4 U
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
# t# J9 M" Z$ j" w0 o% R( \- V  <tr height="24">2 d6 s( {; j0 Z2 y) r' T, Q0 P: Q
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>% \/ t& k/ |7 @4 u$ Q
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
/ e; v) V* b3 p, x4 ]    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
3 ^3 [9 s" o* U2 Q" {: Z    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>0 b% @2 a% b: V* Z9 q& J
  </tr>+ Y, l# N+ W" m# `0 Q$ ]% ~
  <tr> & z5 u& Q4 ^; \- z
    <td>
: ]: w/ k+ R# I+ ]. U- f: C; v  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">% R4 a3 n2 ^; c8 p2 N8 R: p
  <option value="0">请选择部门 ---></option>
! P: f  C8 A  [5 Q<%. }" C% F8 |5 T; J4 u& I: j
    string sqld="select * from tdept";0 b6 s1 g7 \  ?  d" U$ x6 g# g
stmt=conn.createstatement();
5 z0 m; W/ c  G( X0 prs=stmt.executequery(sqld);% Q; c! y- v+ }. d4 g5 w
while(rs.next())
5 S* n& c& |: f7 Y{
( a  l3 T# Z- k4 ]9 m8 R- }%>
& c6 B" U: A6 O* `- R# J% Z  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
  f+ e% o8 P3 }. b( P, P<%4 w5 h4 @8 `8 w) U9 x
}
* U! j4 d+ R: _6 n* F%>
# u6 A3 t% r3 B2 }5 U2 N2 D5 r" F  </select>
3 |# w$ l3 ~* W3 U% k, H% s</td>. x3 B" n, A# D+ E9 n9 e: o/ G+ U
    <td>5 [  |% n( |" k8 g
  <select multiple id=city style="width:150;height:200" class="bgc">
; A/ g9 S( b$ e" u5 [: C; {  </select>
! Y* O8 ^9 D  e, |! Z6 z' D# q" Y2 f</td>
2 c; c2 @! D* }    <td nowrap align="center" class="bgc">
0 k, h/ t. M* M: ^7 c9 r3 l& ^  q  <input type="button"  value="<<" class="buttons">! c/ Z' x7 C. ~# p2 U+ ~; A) w: G3 O, m
  <input type="button"  value=">>" class="buttons">
" h; g2 z5 y3 J* p) s0 h" @( r6 z3 M</td>
6 @$ Q) x5 P: w/ B! @6 O    <td>
7 Q/ Z' }/ w- T/ w( Y  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">7 ^6 o6 s/ S! F( ^% ^1 x9 F: J' E
  </select>% Q5 R: [& G4 f8 S4 y
</td>
5 u4 ^  }* O2 R1 A  </tr>) K- H' F9 Z1 k  L/ {& |
    <tr class="bgc"> 7 O+ P, y3 P8 |0 ]6 o5 A
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>9 G' `+ t9 [3 s. A6 i
  </tr>
: G  b3 S! L: e* Y/ d</table>
1 A# @# b, N! u1 @/ M</form>
; \3 G+ w$ h; u) Y6 J+ n<script language="javascript">3 A/ P% m! Z2 o8 d" Z, @  A. [: b& X
//人名移动
7 v/ L' ?# p  m$ g: I9 m9 v. X- afunction move(fbox, tbox) {, m# R# K, U) g) `
var arrfbox = new array();% W8 V: l+ l* t( s: C
var arrtbox = new array();
8 v. v3 ?: w- i& g5 }7 C+ L( _( _var arrlookup = new array();; o- E' [0 v: \& h9 \# K
var i;, }3 W9 z% B6 V' L* J8 ^
for (i = 0; i < tbox.options.length; i++) {: y  H2 R' A7 s5 @9 C$ T1 O
arrlookup[tbox.options.text] = tbox.options.value;
# S# U6 @) r. D, L) `arrtbox = tbox.options.text;1 ?5 c% G& C/ M( `
}
8 |0 E+ Z6 e( O/ N( D" o4 wvar flength = 0;5 i! k6 T( O$ {5 V: L3 Y: p
var tlength = arrtbox.length;
3 M* j) F3 l. R( C+ t6 F5 s( ]for(i = 0; i < fbox.options.length; i++) {. z) p6 u5 W, F: z# S
arrlookup[fbox.options.text] = fbox.options.value;
3 J* y* N0 @* {+ @! lif (fbox.options.selected && fbox.options.value != "") {% U3 K$ g7 r2 t- Z3 ?
arrtbox[tlength] = fbox.options.text;+ ^7 U1 [& G" _/ [
tlength++;6 p5 C$ ?& ^4 u) a8 j6 C
}3 n" X( I$ d7 |$ P1 r- C+ \
else {
2 j* B6 x1 W/ D1 tarrfbox[flength] = fbox.options.text;0 G4 e1 J' q* c
flength++;7 K2 x, i: V2 O+ m  E: k( M4 _
   }
& N! R# l3 H6 N$ w}
( z) x$ T( l% uarrfbox.sort();
; j7 N. Z" G3 l0 q& uarrtbox.sort();* v, ?. f$ ]! w* {( C# l5 L
4 t0 }- v9 \7 O7 [- U7 l8 l
fbox.length = 0;  X3 I6 \, _9 P0 w! @
tbox.length = 0;. L4 d" q4 f9 d' J2 _& K
var c;% H: o/ f; \0 q( Y9 Y
for(c = 0; c < arrfbox.length; c++) {8 i' y; F: d1 i$ i
var no = new option();
  H1 x9 y8 _- Tno.value = arrlookup[arrfbox[c]];
& W+ H5 G9 D! t, d: S8 e! I* ono.text = arrfbox[c];6 U  W$ \& Y# a1 `7 a" ~
fbox[c] = no;* X3 H' p, V( t0 p  |
}
" w) G) x2 k. B6 T. lfor(c = 0; c < arrtbox.length; c++) {9 l8 b. h& \! y" k9 j) B& ?
var no = new option();3 W/ j, ?" v4 I
no.value = arrlookup[arrtbox[c]];
3 \# o  U- s3 D8 ?1 R, mno.text = arrtbox[c];
  h: ^8 \: [7 r1 J) a& B! _* ztbox[c] = no;* j6 Q8 F2 {9 g4 `5 }; O! y
   }/ V2 S3 _" h" V
}6 b) y5 R7 r% z4 ]: V; T- I" d1 p
</script>( T7 f; C/ e) F: `- H
</body>
8 J) D( H& m; U& T4 e+ J





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