Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"$ \- Z# H6 V: g3 j9 o
         c pageencoding="gb2312"
5 X$ u; V* h* y: R" i) B4 v; P9 t%>
6 b8 Y, k1 _/ @$ V<style>+ y, e6 ]* [! ^
.f9{ font-size:9pt; }
  V, g. L; p( J- R; Q3 j.bgc{ background-color:#aecaf9; color: #0033ff }
5 m! `; Y" P/ A8 L.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;# e( L1 Q, E' w
  border-bottom: solid 1px #4e7dc1;/ l1 |. Z8 F- ~- j, u
  border-left: solid 1px #aecaf9;8 a$ ~( V# W2 c- o0 X! C
  border-right: solid 1px #5679bd;
6 N3 ^3 O% x, S4 Q) P1 J  padding:1px;- J& R/ p( o) @
  margin:0px;}# J% q( ?! Q) V8 o4 _
</style>4 l, X+ y+ d% I8 t4 ~9 l
<script language="javascript">
* m/ @8 O; H) Y) t<!--9 z8 ?" m7 ?# X4 `
function rv()5 C6 L% y' u' q7 J% y3 K
{, S% r5 v8 z) z- n- R" U4 f) @
  var val="";
6 p2 F# [2 J% z8 N: J7 d  for(i=0;i<combo_box.list2.length;i++){7 H' r, _  {  i) b! G" S4 A  x
   val+=","+combo_box.list2.value;
. j% H; [  G9 Y4 u  }
* N. D! D  V3 Z6 y. m; V  o  if(val.charat(0)==","){
0 F4 N# y  U4 N8 _5 z9 b  e   val=val.substr(1,val.length);
. B# x( ^- C" r  }
' Y6 ~( V& o, o9 x$ q0 |  opener.form1.frecname.value=val;
% O% g$ ^9 M3 K  self.close();
  N& D( a; e3 l6 U& r9 b}4 ^! S. p( a* s" f' l% R& Y$ I
//-->
( Y9 [4 N' M' ^* c% V  x. h/ `' P</script>
. n% @/ o5 H4 `# U( m! g$ e( e3 r<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">. l- ?: T3 N, S# \
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
( d5 j" L( I9 {- D- p1 e<%
1 u4 V* f3 t/ \9 o2 g  cdatasource ds=new cdatasource();  //数据联结bean实例2 K) x6 N2 ]8 N) u% p
  java.sql.connection conn=ds.getconnection();9 J" P9 c( Y4 w6 n3 e  E
  java.sql.statement stmt=null;
: m  E6 c/ i, R  t  java.sql.resultset rs=null;) z( s5 z0 _- P4 b3 `4 k5 b
  cdatacheck dc=new cdatacheck();
% ]: O! Y- ?7 u8 ?/ K%># O9 s& q0 M/ w8 C' q/ H" W# i
<%8 W* C! r3 L; |; N- o
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";3 b5 j& e+ t6 K& z
stmt=conn.createstatement();
; S7 B+ i% Z2 p2 `* C% |rs=stmt.executequery(sqlu);; ~5 v4 z: k6 e; H. M; V
%>; L9 j# R2 _8 C4 i+ K1 r
<script language='javascript'>
$ W  a' J: w7 a. p+ oarr = new array();
- a4 k7 {& w( A/ L% y7 K% t; T/ o<%  int temp=0;
* J& t2 ^. j$ q/ b/ rwhile(rs.next())
4 V& y& z, w9 G6 o{$ Z$ A9 \" L" U- p1 s
%>
7 i/ F" [/ Z  m4 Uarr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
: M; z; q$ @( f+ T<%' G0 \9 m8 Q3 m: M
temp = temp + 1;0 x/ a6 n! P" F: C. F1 h
}
% U; }7 Q& e7 t. j%>
7 `, e0 w9 \- |3 l& |' w5 htemp=<%=temp%>;7 {% u; i% @1 o3 `* f) |
function changelocation(id){   E+ P( _* x# \
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 9 Y& W0 N, E' I3 G6 F/ Q7 L. S
var i = 0;
! A% x6 G0 Q  `' V! o, L- pdocument.combo_box.city.options[0]=new option('-------','');
7 q7 d- P' ^5 M' r# S0 Ffor(i=0;i<temp;i++){
) e! m# \5 \7 lif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] & p+ `6 A' J7 B4 H9 l
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
) @" e. [% K3 S( B- \5 t} & a- N# O3 y" L
}
" y- B  G% y# Q3 P1 U$ \* Z} 5 [; M: B7 ]7 R6 Z8 F/ e+ P
</script>
9 E% u8 v7 B3 c0 S( J4 X+ e: E5 R, ~7 x* w
<form name="combo_box">
9 p2 ~/ @3 O( r<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">- ^2 S7 S$ W$ B/ d7 h: h! z( R5 ?
  <tr height="24">( j& g" G4 K, s  ]) A
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
" b0 S! Q3 L  i1 x    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>. Z( B4 t% G/ N+ o( _
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
; z; X# Q: ~# X% w4 {# ?% u    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
; ^' B  h" Z: y8 U' e" H  </tr>
+ A0 D* M1 F/ P3 Y8 S  <tr> : Y# |9 m/ V( k  _' Q/ o/ ~- [
    <td>0 @8 f9 I/ \) N3 X$ P' v
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
) J, x: V: b3 Y9 m  <option value="0">请选择部门 ---></option>
+ w# c  K2 X+ s" \; u! t8 x<%
% K. B# H  Z* e4 v3 e& O4 P0 g    string sqld="select * from tdept";4 n6 y% E+ w3 [# F! F% |
stmt=conn.createstatement();: w$ t/ _8 I" e: p# T9 ]& ], p
rs=stmt.executequery(sqld);9 i" L# C5 @/ i) I6 h7 x9 Y/ B7 a
while(rs.next())
, ~; V, e; s5 V" S1 W{7 B2 M% N/ O3 l8 Z+ x
%>
% o: k0 O' {, o) t2 z4 W+ X  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ B' U0 b! z, d; r" ]0 ?<%4 e) h2 ~# T" O' M" o, l
}
8 ]) d. v1 j3 b/ u%> ) J  m, T( g7 d; w
  </select>& O8 Y' e1 Z$ Z& f/ X3 a$ @
</td>* h( `% E5 Q& k2 n$ \
    <td>2 y, z# L- _" M, ^5 v0 t- s
  <select multiple id=city style="width:150;height:200" class="bgc">
" M7 D) d! |0 j& w/ z  </select>+ `! J2 J3 P: v
</td>
$ e' {8 g) {$ m7 @) F) ]    <td nowrap align="center" class="bgc">
8 a# Y; N6 `$ d; l  <input type="button"  value="<<" class="buttons">/ n  S$ H% J, {! o
  <input type="button"  value=">>" class="buttons">: u. n  E% }+ ^, h
</td>) g% n  u1 O7 _5 P$ t! e: @
    <td>
$ _% K; [4 h0 |' {  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">; H% ]) S9 _2 m) n8 h. }  ]
  </select># r6 C  G/ o1 [3 \4 f; m
</td>
: w8 L8 N; D( z3 N  </tr>
3 ^$ X, b+ k. L% k; H6 n: l    <tr class="bgc">
( j1 s& p, \; d1 p0 E. L  o1 }9 Y. S6 O    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
  I) O6 X0 V% @0 K8 b( G2 ]  </tr>
0 a! R* ^1 K7 N</table>
7 t9 b8 r# {; b</form>
$ d- O7 ?& `# m7 S6 {6 A<script language="javascript">/ a3 J+ A0 o& T* q0 _; M
//人名移动
. a. {: V0 A5 T: k/ _$ q, ]5 gfunction move(fbox, tbox) {
- k0 n. J* T) z  M+ x4 P. u" Zvar arrfbox = new array();
5 Y. g) ^/ `$ H* O) E7 Gvar arrtbox = new array();3 U( r& b: K$ |2 B0 |) U
var arrlookup = new array();8 c) E# D8 {1 p) ^' h
var i;4 e% C# c9 X; n& S" B% Q
for (i = 0; i < tbox.options.length; i++) {
9 Y. b* m7 c8 {; R  L5 Earrlookup[tbox.options.text] = tbox.options.value;' q. @7 {- c7 n' z! E- C
arrtbox = tbox.options.text;7 K  L& L  t5 s0 t
}0 E$ F8 h5 W+ P& f. f8 m3 s
var flength = 0;. h/ f$ K7 }# y0 R& a/ w- Z7 S
var tlength = arrtbox.length;
4 U. ?$ {, Z$ s- Q: l- \* K0 dfor(i = 0; i < fbox.options.length; i++) {* V1 n' b1 m9 u% f; E3 t/ C2 a) ], q
arrlookup[fbox.options.text] = fbox.options.value;
7 Q2 ]0 M: K$ cif (fbox.options.selected && fbox.options.value != "") {
( G8 s" I9 e1 J5 `1 M/ larrtbox[tlength] = fbox.options.text;
! o) a4 }( X% z; T- Vtlength++;, ]' N2 [3 `7 {2 b0 X" i
}" {  b& m/ C) x/ ^% H
else {4 A5 K: U5 z$ K7 Q9 Y4 T) s: w" n/ A
arrfbox[flength] = fbox.options.text;
9 Z  Z' X  C# h4 [flength++;" x: |+ m) o# ^4 Y* b' L$ z
   }2 G+ [4 U( c0 t2 z7 ^) ^& N" K
}
! V6 t$ B/ b( I. Iarrfbox.sort();8 o' F5 v8 N7 Q. K; J  `4 l
arrtbox.sort();
, r5 r- p2 a( M& \7 v# P4 H# m- t/ U. t* J
fbox.length = 0;
: A$ _( W7 ]- Vtbox.length = 0;8 ]$ w1 X8 A' ~
var c;
1 {" k% g( q. \" S' Wfor(c = 0; c < arrfbox.length; c++) {( d! R" V- o9 t/ n
var no = new option();1 }( n& q. l8 S! z0 S  T
no.value = arrlookup[arrfbox[c]];
: K8 o0 O; f' `4 L; fno.text = arrfbox[c];
$ k0 O% @* I, ?5 u9 j. c+ z( gfbox[c] = no;* ]/ S* Q/ k7 g7 U7 i) y) o2 M0 g
}" m3 C1 C2 L7 @
for(c = 0; c < arrtbox.length; c++) {6 i; n+ {4 K6 I% ]
var no = new option();* E5 e/ N# x2 W1 E
no.value = arrlookup[arrtbox[c]];
2 t& |- o2 O+ d1 xno.text = arrtbox[c];
9 _4 }/ t" c/ ]/ T  v( M- rtbox[c] = no;
5 t! Y- c* K0 ~  A7 d" W( `8 L   }
2 b( Y: ?2 ^% Z}: m2 ^. V8 R7 V
</script>
% Y( q1 i8 v& c, V</body>
" d% ]6 Q# m$ B, r2 j





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