Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;", s$ |$ B3 I8 t% H7 M2 R
         c pageencoding="gb2312"
* G( N7 y7 T, y8 M  ?6 |4 R%>
: j. [. Q/ y6 L<style>
8 g: ]& f6 I' C; ], A) Y$ L/ \1 x) e7 S$ v.f9{ font-size:9pt; }
) {- ^) H+ H! n& c3 x0 P- t.bgc{ background-color:#aecaf9; color: #0033ff }
3 j) O8 V7 x7 d) Q.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;4 S9 _3 @; Z7 W. s' ~
  border-bottom: solid 1px #4e7dc1;
5 g) V& o- I5 E) J  border-left: solid 1px #aecaf9;
( b  h- a. J4 p+ `- C  border-right: solid 1px #5679bd;( }5 w# N! G( y" K( l6 X7 H2 C' }7 H
  padding:1px;* B" t' n# S" F0 C" Z4 p" M3 a
  margin:0px;}5 ]0 ~0 t4 }; x1 ^
</style>
  c9 |3 O- j- D- m<script language="javascript">
5 B# O1 V0 i" J7 K$ S$ Q2 Q, r. ^<!--
2 b9 V3 ~- p- B% ~- hfunction rv()
% v3 h4 d6 H/ m4 s4 A{
8 `/ L& \( O4 c; M, N# M% n& X: W  var val="";* f( w6 ]& t; ?6 `3 U" E4 W  ^
  for(i=0;i<combo_box.list2.length;i++){
& a( ~& E" a& `1 `5 t   val+=","+combo_box.list2.value;
( r2 S' ?3 ^2 I! B: H$ p  }3 W2 G& O7 L( \4 ]7 t1 ^
  if(val.charat(0)==","){
, `, F7 Z( x3 D) y" c7 J   val=val.substr(1,val.length);/ V# m/ ?5 M, v7 k
  }4 E; @# \! K) U: x$ H7 A' b8 z
  opener.form1.frecname.value=val;
6 H$ r5 B$ [& e; g: }4 ]  self.close();
& r/ M7 O# U3 i4 ^; X" i; x8 V}8 i  z( D) M% e) o1 o
//-->
2 q) }4 c1 f  v2 |</script>
! a* q9 x1 @/ t2 s1 r<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">" S  ?2 b3 r5 b4 r$ O
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
7 W5 S9 O" ?8 u" \- h  p: R<%& [- k3 o6 ^0 y- R7 Y( b" C
  cdatasource ds=new cdatasource();  //数据联结bean实例: U, W1 G  V: o7 s# _) [% v4 D
  java.sql.connection conn=ds.getconnection();, w2 e" P' C: Q3 H
  java.sql.statement stmt=null;
8 e' `* ^7 z% U/ J, ^5 F  java.sql.resultset rs=null;$ G4 z, K' o3 ~. ~+ Y, z
  cdatacheck dc=new cdatacheck();# i8 w; e5 A2 L
%>) M+ T" L% V. h$ x
<%6 W' v% V1 x4 |* v5 B2 U7 u; |$ e
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 M0 [# Y- d/ k) u. Xstmt=conn.createstatement();' |* N' J+ v% V8 r; ~0 q
rs=stmt.executequery(sqlu);
/ i1 Z; l+ G/ X" _8 c4 B# _1 p%>3 t6 u; Z* R( ?: k$ M  y
<script language='javascript'>% X& G6 M, P5 m5 }3 J
arr = new array();- t4 |1 Y4 B% q
<%  int temp=0;  Q' Y  ]5 v' [. X
while(rs.next())
5 I1 H7 {; X; X* r. H7 l{
9 R4 C, h! L* e! c4 n0 T6 U%>
% K# M& R* f- x1 ]arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");+ S7 H5 N; \( Y
<%3 x/ e+ }0 W& n3 D& P0 u
temp = temp + 1;9 v( V; q3 {( {, {: z
}
! l$ ~1 o; p% ~. J% k%>5 K9 X" _: ]( V% L- {
temp=<%=temp%>;6 ?9 z8 V7 A; }# E5 F* f0 g  w6 D9 b/ S' w
function changelocation(id){ - a' W2 I. Z, l/ N
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 + @3 m3 e7 j' k1 M! ?
var i = 0; 4 B: I1 E5 ]/ V; M6 ~
document.combo_box.city.options[0]=new option('-------',''); ) w, Z  R( V+ A. k8 \
for(i=0;i<temp;i++){
( m3 E+ @$ N4 i4 Q$ uif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] + ^7 x0 w: D# M! T9 b  q) e
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
3 T$ V: [9 W( z2 p! @) P}
6 T* t4 m& ?+ U9 K" ?. {9 M1 ?} % `5 t: {, u* s9 s  Y6 o
}
  }1 D' e7 d2 j1 b0 m( }+ L</script>
0 c& M+ h5 @5 Z# y2 f7 n
7 s/ N7 b" H1 f3 Q& h7 ?  B4 x) W, g<form name="combo_box">+ a; p, P  a+ J) @1 P$ ?
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
8 _+ T0 G* y: @0 W. t  <tr height="24">& R( R2 U& U  t- o$ q+ o- R
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>0 Z6 n# Y( x* q# Z5 {
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
- [. o& a+ M+ a0 P/ M4 x    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>2 o: ~; G- ^( n9 H$ L& b! n  \
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
+ d. @2 J) Q# T  </tr>
0 U, {) g$ L9 G' @# s0 u, W  <tr>
9 i- X! q* f; P    <td>: k5 w' l7 _0 A7 V# \+ a9 s
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
7 l0 g  s: _5 ~. n8 y8 C  <option value="0">请选择部门 ---></option>
9 v/ o" n# w1 z7 {# D# @8 T<%
# U) m+ j6 {3 c: S/ o, m    string sqld="select * from tdept";) Y, I' P# ?1 e$ U; z9 s# f0 [2 m
stmt=conn.createstatement();+ G# \: o! w! ~
rs=stmt.executequery(sqld);5 S  q! t9 W. f8 Y4 A0 k
while(rs.next())4 G# y! m" b  g( J3 i
{
& x! @" G6 L/ D6 m& d; F%>! ?$ U0 p. v0 X  }; ?/ a
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ t! |: x$ a( \/ f! R  {<%! t# K1 L! l" \( q
}
" ]: t2 W& d! a& @0 H%> * k& k- W# ^% c- E# N0 K2 Q  b
  </select>) ~' f: n8 k; n9 r0 N& O! F; d
</td>
% v4 N1 N7 C6 y    <td>
6 o" V  ]- |2 N7 [- I- i7 V8 m  L# _  <select multiple id=city style="width:150;height:200" class="bgc">$ ^* O* n+ Y( j9 m. A# r. ?0 P
  </select>
$ d* b! b$ b* R! q% A$ v( E  x& e</td># w: q5 p- s3 o; A2 a
    <td nowrap align="center" class="bgc">  r4 G3 [1 k  D5 K5 ~% B, a
  <input type="button"  value="<<" class="buttons">
' D. j3 c0 T8 O. o% n* g  <input type="button"  value=">>" class="buttons">( r# S8 g6 {( W' R/ W& k
</td>* d! s' X) |- c: D, S* N1 e1 X
    <td>
' a  C9 \% \/ q6 ]! {  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
7 [- a7 B1 B. D" c  </select>" o0 Q1 z6 u# N0 r. X3 m5 U
</td>
2 _( P8 G2 x* T# f- d) Y  </tr>9 Q+ Y; }) q& G9 \9 G: R  j6 f! }% Z
    <tr class="bgc">
3 C9 `- X& B9 Z0 ?) `% [2 z    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
4 |4 Y: L3 E, H1 ^; X  </tr>
8 |5 B) v# d2 ]</table># }/ L" \" f: M
</form>$ ], q: H, ^) Y. o. B4 r
<script language="javascript">$ L! c9 {8 X6 G/ f9 V
//人名移动
6 u! v) L' ~% c% m, E3 A' ufunction move(fbox, tbox) {
6 O% g0 ]3 {0 Mvar arrfbox = new array();
/ Y; c! x! A; A# s  dvar arrtbox = new array();
. {( x/ K+ @3 L, \9 jvar arrlookup = new array();
7 a. m# l$ P& J- U6 f+ ~% ~) qvar i;0 E5 ]$ s* C/ q6 _0 P
for (i = 0; i < tbox.options.length; i++) {$ z! n7 D2 [3 m! ~5 Z7 K- ~
arrlookup[tbox.options.text] = tbox.options.value;
6 ^  ^; H% W. B3 B/ L$ harrtbox = tbox.options.text;
) \% i4 C3 y5 F/ u% S; E3 ~9 h' d}
. J+ ~: l3 N1 h- }& i' \- ?var flength = 0;
( N7 N, Y% J1 |- Tvar tlength = arrtbox.length;9 q2 Z6 g! O$ q3 r
for(i = 0; i < fbox.options.length; i++) {8 o0 g% x  H- w1 H, A
arrlookup[fbox.options.text] = fbox.options.value;6 Y  `8 ~. I7 T. {$ V/ b7 g
if (fbox.options.selected && fbox.options.value != "") {8 |/ U# \6 B8 ?+ t7 h) Y1 N
arrtbox[tlength] = fbox.options.text;
1 P. K3 f! s! r3 H% q1 N' z9 L; utlength++;6 E! v( X; u5 e
}
, B; f* b4 l; Q- P+ V; yelse {! V% e# G/ y5 W8 _
arrfbox[flength] = fbox.options.text;
0 I- d- r/ Y7 s& C+ @0 uflength++;
; g* G9 @  P2 Z  X6 p   }
0 M. b: t' e0 n) E/ s}
" Q  g. l; j4 `9 @# a; j8 ]: z/ [arrfbox.sort();$ q  c# k, k0 s6 A2 h) j3 E
arrtbox.sort();% o) l: _, I% A/ _

" O' C8 r2 l) Q( P6 z3 hfbox.length = 0;
9 A9 O6 m1 B" s. wtbox.length = 0;4 H6 F) O- E0 j  l6 ]6 W; O
var c;, J. _4 C0 ?3 V5 F' Y: s& t# v2 T1 @
for(c = 0; c < arrfbox.length; c++) {+ O) Z: e  |) H" a; u
var no = new option();
! V' B6 b( D. I6 ~no.value = arrlookup[arrfbox[c]];; z& s6 b9 z* m3 `
no.text = arrfbox[c];
" u/ _" F: N, @. R9 ]' z2 Qfbox[c] = no;" O0 _2 K2 U/ Z
}  `% V. R6 \* r
for(c = 0; c < arrtbox.length; c++) {
$ o8 G& A0 |& X- a1 ?3 dvar no = new option();
& D  f, @, l; r( ^! b3 nno.value = arrlookup[arrtbox[c]];* z9 C' \. T# b2 }" Y. w% _1 u
no.text = arrtbox[c];
. e; h# b8 Z- H# K3 Ftbox[c] = no;
9 N4 H8 A0 s6 X% e$ }( L. O' D   }
. `- n5 k( O- {' y% v}
4 S; r4 H. H7 u</script>6 k8 c4 Q- o  c- K" n6 n' S8 s: Z
</body>
8 {: M/ p! C- d% k7 ]





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