Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;": G+ z$ c% \' f% g9 C
         c pageencoding="gb2312"6 G, B, A4 j7 Y* n# }, m6 U
%>
+ A5 n& D3 u1 @% k0 M" Y/ k<style>/ b# ^5 Y7 \  V+ K$ L
.f9{ font-size:9pt; }1 U( g) ?, X% E
.bgc{ background-color:#aecaf9; color: #0033ff }
9 E8 j& ?5 Y% X5 |- [' D.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
# q) X4 J5 L4 |  I  border-bottom: solid 1px #4e7dc1;' G) \. l' j, z& Z9 S+ {# Z
  border-left: solid 1px #aecaf9;0 T( P: M5 K; Y8 i. C6 J8 M6 w
  border-right: solid 1px #5679bd;+ M- X/ O* w5 _; ?( m/ N6 u, P
  padding:1px;" K8 }) }  Y- ~* Q
  margin:0px;}3 W8 h9 n' s2 Y' [2 o
</style>
# c2 F" F, Y# ?2 [<script language="javascript">
( s$ Q7 |8 [! F" J# ?5 v: `$ s<!--
; ^0 e; K$ W0 X  pfunction rv()
& P: |- _. N) N, z$ N{  B6 q! ?9 q6 K
  var val="";
/ t/ F1 w% m% Q  for(i=0;i<combo_box.list2.length;i++){
% H0 V! C! Z0 Q2 K9 t; D   val+=","+combo_box.list2.value;. C0 O# j6 N9 ~8 Q' e
  }. c  @( v; F, k" _  b) y" d
  if(val.charat(0)==","){9 j. u4 B9 W  R
   val=val.substr(1,val.length);
# F/ h$ I5 S0 i  }
% w4 f8 U: L' m  opener.form1.frecname.value=val;9 Q6 B+ h: F7 |, y  ~
  self.close();: I% A8 _+ i4 X( v
}
( N" F; x7 ~% H//-->
$ u5 b; _; R% V  r) S</script>' z8 l( Q2 }. ?4 W- I& \# x) l0 P
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
9 {+ g6 M# w- p6 {$ [1 m% u<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />6 O0 ]. |3 ^6 m. `, v
<%
4 r5 r2 Z* O- B: i  cdatasource ds=new cdatasource();  //数据联结bean实例0 ~, C) Q! S7 X5 d
  java.sql.connection conn=ds.getconnection();* _8 [' u+ M+ U5 W' y
  java.sql.statement stmt=null;3 U& J7 P, v9 v: K+ S7 r( C8 z. Y
  java.sql.resultset rs=null;. H* A$ i& D  `4 F" ]$ H
  cdatacheck dc=new cdatacheck();7 H! ~4 Q! J$ c* ]- A
%>( B% |' B& ^! m% H" e6 }3 t
<%
: H$ m- x8 R9 P9 c: U3 \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 k  E9 ?8 d) t6 X7 k3 K
stmt=conn.createstatement();
' O0 k2 u4 v" w* Srs=stmt.executequery(sqlu);
& |/ p7 K/ U5 w8 ~% G%>5 w5 @1 x& d: G; }- ?
<script language='javascript'>6 q! N. N2 z* o' W
arr = new array();' m# `# i+ X1 C& m* Q
<%  int temp=0;, ]. _, \# W3 S& `0 z0 s* z# t
while(rs.next())
  S. T, d5 R4 Z{
* S7 ^2 H1 i+ e2 _%>
+ ]( x3 J8 t* ]+ ~9 @7 c1 Barr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");' ]8 o7 P( Y' i" c4 O7 M0 Y. I
<%: h3 E3 g% T0 \8 c4 F1 N: S
temp = temp + 1;
7 V+ o# J, z! T, c" L}
) u% i; X- t7 p+ Y5 B2 M%>
" j  [8 B* f" o' r" ^temp=<%=temp%>;
( O8 u- |5 m' ^8 \' t: yfunction changelocation(id){ & D; T$ r- J7 d  G, P0 Y" o! ?% b
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
; V6 ^8 ]) B( Avar i = 0;
) h) e3 d- k6 ^7 g5 vdocument.combo_box.city.options[0]=new option('-------',''); + M$ P+ o$ C0 S
for(i=0;i<temp;i++){
, b7 b; c* {8 |0 {: U& Bif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
9 E7 A0 E& {* n: r# q7 Q8 F0 e% E: adocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); # V4 n7 S& F9 q0 _) v2 @( Y
}
% x5 Z& z3 `2 y9 G/ w} ; U$ x7 u/ F# H7 d+ M" N# j" w: K9 z
}
/ q! A( t0 l6 c  Q</script>
- ~2 Q& M" @% h% y( i; m/ ]$ o, r2 l- `
<form name="combo_box">1 T* [; ]& N% Y4 z4 g8 B
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">5 F6 I! r, v  `  {% ~
  <tr height="24">9 D: p0 k1 o+ w/ k
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
# i. \; H; a/ a2 ]( {    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
3 U! b+ l0 {' o. f' C    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>5 d1 y1 m8 Y& n5 F' N( L; G
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>9 ~( A1 B7 g* A( X1 c. H6 A
  </tr>: T; U2 E3 s+ F% n
  <tr> 0 Y8 o( n% W/ A' C! j
    <td>3 p# A, X' O7 E3 D3 T, }9 k
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">: T# v; w* }5 Z  W6 c
  <option value="0">请选择部门 ---></option>$ @7 h& N( k1 |8 T+ l1 q0 Y
<%
; r- ?; i* e1 K1 H. c6 e9 ~    string sqld="select * from tdept";1 m5 k- T; L$ _$ J+ y6 D7 f
stmt=conn.createstatement();+ j" U5 |2 u2 e7 ?9 Z1 z
rs=stmt.executequery(sqld);
  k& j2 |/ o- p- B  \& K5 b- Lwhile(rs.next())
; R/ |5 P2 Y8 Q5 _; `{  V4 O/ G8 L, N* ?! f. b( F
%>
. ~0 a- `* P) z- C* r  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
5 K7 N+ l' T; o+ ~( Z1 I7 o% B! @<%5 i2 ~; K' q  ?8 [* z' ]2 u4 D
}0 v' D! W- U8 q8 g( _8 X2 V" S
%>
0 l/ Y5 T8 w" j& A0 }  </select>! i7 G+ M5 ?# B3 J$ D% q; b
</td>
4 k1 G% [. V8 G; b0 f! F1 T1 U    <td>. H+ G0 i$ o  \* ^2 g; `. o' \
  <select multiple id=city style="width:150;height:200" class="bgc">
* v& z, Y" F4 Y5 ?* X! P: f  </select>
$ @7 ?. z! f# F" s0 f# Z1 P1 F</td>/ R3 g8 i' \3 u' s* J
    <td nowrap align="center" class="bgc">( u; v0 K% b! T
  <input type="button"  value="<<" class="buttons">
# u' b/ [1 S$ v; k7 M  <input type="button"  value=">>" class="buttons">! o3 x% _+ U2 v% R: h$ z
</td>: f& O) L* r3 k
    <td>
5 h8 @/ h  h# q' t% l  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">! Y6 S' g. v& I
  </select>( k6 }* s1 Z/ m9 L$ H; a
</td>9 J' S6 y( w9 Y2 z1 {
  </tr>" ]: c) R0 Q1 x6 C6 N6 }" h# W
    <tr class="bgc"> , S* R  \  j0 P0 @# I& ^
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>8 l, ~8 r4 L' p5 y% ^
  </tr>
$ j/ I- G2 T" V: y</table>8 p. I8 G; A+ Y+ S6 v
</form>
# x- _( v1 e% t<script language="javascript">  X0 v$ |6 P) ^5 f: Q2 o
//人名移动* u. D) N8 c4 n
function move(fbox, tbox) {3 ~. U$ [, e! S5 S# I" b" D
var arrfbox = new array();+ k; |* w9 B) q5 [' B$ M, Q  V- W: @
var arrtbox = new array();/ }! Q3 G/ z% o, N7 F$ v
var arrlookup = new array();
& I, E( i  M. Qvar i;3 ^3 g& q( q! Q5 T2 B
for (i = 0; i < tbox.options.length; i++) {. Q; V: g4 ^  f3 A8 g5 Z
arrlookup[tbox.options.text] = tbox.options.value;
9 V7 Z' p0 d- ?. B! Uarrtbox = tbox.options.text;$ _6 P# t: R9 l9 E. g; \
}. J" L9 z3 L$ s1 V3 h
var flength = 0;( x. K% K1 l$ v. r& c
var tlength = arrtbox.length;3 X+ Q5 U. {  n7 g6 J& g& c: x
for(i = 0; i < fbox.options.length; i++) {
# }6 s; d: C, x% farrlookup[fbox.options.text] = fbox.options.value;- @3 u; v2 X' |4 I' j  m
if (fbox.options.selected && fbox.options.value != "") {
! B. Q4 o) H+ ^0 f& \2 garrtbox[tlength] = fbox.options.text;/ Z4 f2 p. c5 y/ Y
tlength++;0 i1 Y7 r  l& t3 @; R3 _
}
7 `4 O4 [- z6 melse {
. E9 t  Z. ]; z: M) C1 b& W5 tarrfbox[flength] = fbox.options.text;
& [' M2 F2 p+ X$ Zflength++;9 i* O+ D) g( q
   }
) d7 E: M4 N: Z. h- ~}
0 d* r+ d5 U3 t8 |. {$ qarrfbox.sort();9 A- C( F. L5 D- L( b# Q
arrtbox.sort();  [( D1 m1 _2 s. Z

  d' H* w% r/ P3 [) dfbox.length = 0;
' Z* t  y7 o% K# W& `  \! @tbox.length = 0;" G, z& k" d8 b; R+ N% i
var c;9 m; p2 }8 B- ]/ M8 I' c/ O
for(c = 0; c < arrfbox.length; c++) {
) P- e2 N1 x1 D: }6 Xvar no = new option();
. d: P$ {0 ]+ k2 x) Y8 Pno.value = arrlookup[arrfbox[c]];( w/ m; |9 ]  i2 Y$ t5 c' ~2 q& Z
no.text = arrfbox[c];. B6 u& Y- F- a$ ?) |8 ^
fbox[c] = no;. j+ @) T, _# Q1 N6 D2 t0 P
}# i1 i2 t0 u! q3 d; |" v. G
for(c = 0; c < arrtbox.length; c++) {
( d) @; h4 `9 wvar no = new option();
3 m* s! k( C+ I2 r- y& rno.value = arrlookup[arrtbox[c]];
+ g& X+ f8 Z, ~  z  Xno.text = arrtbox[c];
, w3 P4 Q0 z0 u- ~0 Z1 qtbox[c] = no;
" w" ]" [% I4 T4 z   }
, c( D- O. @; c/ W& u" ]+ F. l& f}
5 n% c' |: H; ?3 o</script>
3 X! m' F  Q* h9 N6 O</body>* a# b, ^; d7 U/ k# q( x  S





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