Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"; ]# Q1 D" [, ~6 l
         c pageencoding="gb2312"
+ f: z  w6 A* U2 ]! S%>3 _4 c1 `$ w1 _3 u% q4 K
<style>
9 k3 \; z+ \* g8 B1 c.f9{ font-size:9pt; }% \( w; c: h4 Q' E  `
.bgc{ background-color:#aecaf9; color: #0033ff }
" S* S, g, K" h& {4 |.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;& m4 ~7 Z6 l6 G- [) m
  border-bottom: solid 1px #4e7dc1;- e& B% M" d, j0 Q' I
  border-left: solid 1px #aecaf9;; a9 U$ K* J/ Q# z
  border-right: solid 1px #5679bd;
" \3 n& x7 n3 g9 ]  padding:1px;
! m- r- e1 r3 O$ q, D, q- e  margin:0px;}
) ^9 P2 M9 _. |' }- S( N/ \</style>
) n& K0 L- P% E<script language="javascript">/ \% }* g' J/ m# e3 u
<!--/ ?' F9 C" }, A
function rv()" }+ g' Y. ?4 w
{: L3 u: S$ _/ B
  var val="";
/ G- c$ X: i3 ]) K; K4 x  for(i=0;i<combo_box.list2.length;i++){9 G; o/ n9 ]5 f2 E7 {
   val+=","+combo_box.list2.value;
) g9 r7 L) P; T' @+ ?2 {  }
! M  L3 X  M3 F1 }8 J8 P  if(val.charat(0)==","){& l$ t0 p" V3 j; O$ u0 ^' o
   val=val.substr(1,val.length);
  w4 I; E( O( E3 e  F5 s  }1 F! s1 R2 i1 a: n5 W! e
  opener.form1.frecname.value=val;
0 C! B: A9 {0 A& X6 E6 `! x  self.close();
# e4 t7 e0 n) F' W5 P}1 H, r/ H7 W' D- }  z/ G
//-->
( x9 e, Q( O" ]' Q# X</script>
$ q+ N7 ]% _, }; w) G: w/ W<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">% G  E4 d, k: @
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
2 C* h( S) |% }# \: |/ C3 s$ ~<%$ Y6 L& G6 J" E, x/ [1 B' t! h
  cdatasource ds=new cdatasource();  //数据联结bean实例
, P- w7 a# x* K; t) j  java.sql.connection conn=ds.getconnection();
% Y0 _& a1 e: u4 u) A! q, r  java.sql.statement stmt=null;+ r9 R9 L+ p/ [! d( z/ Q
  java.sql.resultset rs=null;7 k4 s  b& m" \' ?3 ]2 T
  cdatacheck dc=new cdatacheck();
7 a. }8 ?: d9 W$ f" S! g# M: ]%>
0 g3 N& u9 U- o. w<%
$ s6 l9 z& m5 Y: [8 p; sstring 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";
9 Q) J' q: G( [stmt=conn.createstatement();
! \# ]! x( }+ \- R  k0 Zrs=stmt.executequery(sqlu);
$ K2 |  ^  i. W5 \8 v%>
2 j9 i6 X/ i5 h% M6 T7 }<script language='javascript'>, p+ B, z. b2 J
arr = new array();$ k/ d% S1 Y( S# O  C- i2 K
<%  int temp=0;
2 Z! a/ d7 t5 t6 T$ `9 N  Fwhile(rs.next())# K. k+ ~5 ]  W" W6 S9 o- {) i" o5 I
{
7 ^0 R" Q9 s2 c. ]+ W%># t' n8 t# ]9 z% t
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");& |* c% G0 C. T" M1 B. {3 O+ N
<%
2 d- q. ?& u# }% n2 xtemp = temp + 1;* f. s/ r6 @& h* l+ D; f
}
/ j! u, h% E% d0 @! k7 b%>
9 \  U$ }. \9 y% h" b5 r0 ?temp=<%=temp%>;# S, W4 e* ~& V' ^6 G$ w
function changelocation(id){ . T" P- b) G+ o, g8 N9 p: O/ _
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 6 T& v% O% v! P" O: u# V- p
var i = 0;
0 t& f/ G! G' H* ]( }document.combo_box.city.options[0]=new option('-------',''); " K1 I5 R+ I5 Y, m7 Q8 I
for(i=0;i<temp;i++){ 1 \. z; Z  c) l' e2 d3 [$ i
if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 2 h! i& P. v5 `8 s' G2 K
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
* [% x# Z9 w5 `2 a}
7 p4 }- ^- }& W} 0 Q7 u0 a- d1 [# m9 K7 v
}
- v4 P9 S4 j  R/ C: H% u& h</script>
2 a; S% c8 W' T. t2 ~
7 F/ ?' \) m4 ~* j( y7 r3 R<form name="combo_box">; y7 Y4 y" P/ {6 E/ i2 g( q
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
, e/ {5 Z2 _; M  <tr height="24">! w2 b; z$ V% T$ h; Z, }
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
' J8 |& [  W4 R4 w8 s/ Y    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
# @" y7 f3 m5 {6 T; Y    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>. U9 O+ I9 {4 M& N" [6 z3 r0 {) }. m
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td># W' e( G1 M" f& p
  </tr>7 |. r0 L$ F- h2 @
  <tr> 4 \0 W( ~! m& M( o
    <td>
  ^5 S; T5 h3 C# r/ L  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
' }/ Z$ _1 {, e' X1 v+ ]; x  <option value="0">请选择部门 ---></option>
6 ~2 M! r6 N0 p" j<%
: E; }( ^; t+ W( @    string sqld="select * from tdept";
# y. J! A. Y) y4 s& D( O# b5 Mstmt=conn.createstatement();
3 g6 F5 j% l8 x& p' K5 prs=stmt.executequery(sqld);
& _  H5 c1 J, \; D6 y  Cwhile(rs.next())
. V2 ?4 C! f' K( X% a5 C{: F4 z# ^5 O5 c' s! w
%>0 B0 g% u7 Q/ F9 z) c
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>- @3 S) C' h: }/ f  R: A3 B
<%
9 e7 H8 f, C/ m) C1 q# e" Z, h}/ u2 i! Q4 y& ~2 P/ h
%>
) W9 j+ h' Z' `" K/ r, ]  </select>
. }% u  G" m( T& N</td>8 d* H( o; e2 C3 N- G
    <td>7 |+ J  ~% d/ g0 Z6 G; B8 l. e6 X' M
  <select multiple id=city style="width:150;height:200" class="bgc">
; l7 |7 R6 K) t; }) j1 \* Y; l  </select>
( ]0 j7 R9 O6 O, n& g</td># A8 ~: R" m6 H9 p  \
    <td nowrap align="center" class="bgc">6 d/ q! Q7 f" J/ U* c) ]
  <input type="button"  value="<<" class="buttons">
# I$ Y$ x' X. w7 g* }  T# b) V" h& L3 s5 y  <input type="button"  value=">>" class="buttons">: I( r7 r! ?0 w5 `
</td>
3 W) h9 B' a  }! B, C& m    <td>
5 N! h) _0 h2 k5 x/ Z  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">: ]3 a3 h2 S. Z- F
  </select>
, n  I, S7 v. c# H  ^. ^; x</td>
) |6 Q& C3 Q2 S1 \9 @2 T/ [$ |1 m  </tr>; j2 Q3 A9 e9 m& w
    <tr class="bgc">
$ P6 r  k- h1 {* e8 ~& o    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>' [) s2 r5 D" v: h* N# T
  </tr>
5 E+ t9 H6 V' M6 k</table>
# ]7 m' T; l' V; j8 }% m( V</form>9 q5 P- w: V- ?% G" M! G+ ?8 j
<script language="javascript"># s3 o9 y0 r2 ^3 T' a- e
//人名移动' ^( E! v: _# d5 U
function move(fbox, tbox) {0 O/ w/ K6 D# A9 a
var arrfbox = new array();
4 Z; s  K! Q" h9 n& b) wvar arrtbox = new array();+ R0 l2 F% Y. M! T  M
var arrlookup = new array();
6 Z7 K! i3 e" m- U* |' dvar i;, m+ o! n" J3 e! h+ D
for (i = 0; i < tbox.options.length; i++) {
8 [( c/ n  L3 R2 r: ]3 q* y+ farrlookup[tbox.options.text] = tbox.options.value;  Y2 y" i- _* ~  M6 o; m; L
arrtbox = tbox.options.text;
+ Q% j# G! a5 }: x* U}
5 ~2 I0 a4 L( D) z$ vvar flength = 0;
( e/ C1 u/ O6 q  Fvar tlength = arrtbox.length;% x" S* Y  N% T7 U2 |" o& u
for(i = 0; i < fbox.options.length; i++) {& e4 A# p5 l7 e3 L2 A: r) u# e5 ]
arrlookup[fbox.options.text] = fbox.options.value;
, Y9 {8 F) b5 Y  E- h* O- Yif (fbox.options.selected && fbox.options.value != "") {- V# ]& A/ i0 D; x% @* w
arrtbox[tlength] = fbox.options.text;6 w8 t. B1 _* m) Q/ d( P
tlength++;" c/ A, d6 W3 q+ c! N
}$ b' _- T" }" n% l+ ~
else {
3 Q0 n( c6 I/ r+ i9 Harrfbox[flength] = fbox.options.text;6 L" v, v+ r7 f0 V4 z! T
flength++;
$ r8 R4 g0 {; B; C9 F   }" r8 C2 |$ ~5 r5 [4 b
}
) N% \( o& Z$ P" zarrfbox.sort();; c  J8 `4 h9 j2 n% \9 a
arrtbox.sort();4 w* I: q9 w8 P: @
! Y/ a2 u. Z/ c- `
fbox.length = 0;8 ]8 I) @' F  @1 u0 X4 k6 w' R" i
tbox.length = 0;
5 h; w! C/ ^7 h$ p% z) ^var c;
9 I  ?6 ~0 c! Ffor(c = 0; c < arrfbox.length; c++) {7 U1 a) D# ?. ?: T0 u
var no = new option();
" h" ~' s  X4 z5 f* o: d* wno.value = arrlookup[arrfbox[c]];, ?, p/ S, V0 e2 u/ \* }" r; c
no.text = arrfbox[c];
: [8 {1 \* I' s+ X8 Kfbox[c] = no;* G/ Y) O7 _" T9 }' A* E
}
6 c, ?1 H% [$ @. a3 S$ ofor(c = 0; c < arrtbox.length; c++) {
2 c  b# C) `4 W* Q9 ?var no = new option();
$ `$ w1 ~: K& P% J: o8 ^no.value = arrlookup[arrtbox[c]];, @# p" u( I; j
no.text = arrtbox[c];
, F& i& M. z  X' stbox[c] = no;
6 t( Y1 }! h- w$ N; _; R3 m   }, O9 \' J& V% k
}
6 E) a. r, G: G. ^6 [</script>
& b- y3 Y# R3 ~5 X! z7 x, ^</body>: H) [2 {) o; i& {' a9 ?6 s5 L





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