Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
5 v8 p! j4 r+ j; M         c pageencoding="gb2312"' |2 h( X$ I2 S
%>8 @! T3 B' v2 W. A
<style>8 h9 W+ \( R; e! W
.f9{ font-size:9pt; }, b' c, ?6 k( U
.bgc{ background-color:#aecaf9; color: #0033ff }
4 Q: o6 A+ F5 T.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
( _( H$ Z, U5 U; b: g  border-bottom: solid 1px #4e7dc1;
) R5 W: F5 U+ i8 Q% ?  border-left: solid 1px #aecaf9;- T4 ~3 o0 N' y8 ~+ y
  border-right: solid 1px #5679bd;
- }  y9 t1 X" }9 q  padding:1px;
4 `* _# e% A/ Z) _" ^9 y  margin:0px;}4 X" A, Q0 A+ g  p# R
</style>1 ]+ [2 X3 H$ q. _2 k( z
<script language="javascript">
* O' s) O8 o7 \8 s<!--: o( x  n) g' Z1 f5 z7 u  p
function rv()
  J5 K( c4 v; `4 ]6 T# W) c9 I{9 k/ t4 J( S/ s) c, G  F
  var val="";
& |: g; v4 p; n; {7 r1 P3 x  for(i=0;i<combo_box.list2.length;i++){( ?0 _# N+ N, S8 ?3 [! q
   val+=","+combo_box.list2.value;/ N! P9 B( ^- b6 G: o1 X
  }, u* w0 w2 I/ q: Y" K
  if(val.charat(0)==","){
# i" b6 E  V2 k0 q7 d   val=val.substr(1,val.length);
8 K& i" ]3 O8 u" [  }0 j" F6 T8 [/ P; f
  opener.form1.frecname.value=val;
- a- w) x( i0 Q. e  self.close();  d) T" O5 l7 L' _" P8 Y) h: i
}
: S4 R! D& P' P* ?( d& m: @% [( ]//-->
/ U; v* W8 n; S8 W9 ]2 A5 c/ F</script>7 v* i# j4 Z) R* ^+ Q9 X: s6 x
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
8 g; T: s6 K0 O" ?2 P$ }$ s<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
% x- E/ t6 i. H1 r  m3 v<%
5 T3 O. O5 H+ B# h  cdatasource ds=new cdatasource();  //数据联结bean实例: p) e; L( L: Q: s5 j
  java.sql.connection conn=ds.getconnection();" M# n0 W5 W( v
  java.sql.statement stmt=null;' e: j2 W( {/ ^8 t1 h1 d" y1 A
  java.sql.resultset rs=null;# n3 U! [5 ]$ d6 X: m
  cdatacheck dc=new cdatacheck();% ~  ^& T/ n+ ~+ o# K- r1 b2 I1 {# z8 s
%>
! X4 y* X  b3 O& J9 n* c: ?( P<%
; x3 Y  \- v- i2 Q3 ^7 G4 W" Nstring 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";7 x! X7 u/ ~3 _$ l+ x/ V! A: c" g" \
stmt=conn.createstatement();' M, y7 U. c' I. n5 V# y! ~* x
rs=stmt.executequery(sqlu);
# `, e) o: n) q( Z% f7 E%>1 j% j( b" c) G7 W3 w
<script language='javascript'>' S" [5 m$ M' w% l; s( h
arr = new array();
7 ~; G, h1 |& h<%  int temp=0;. i, o! ?8 v* Y8 A
while(rs.next()); ?$ O& I% d# [
{# k3 i- X: Q* `, U+ L$ L
%>2 g6 k! X6 k: k6 f( c
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");5 E4 Q8 ^6 }' t) i6 V( I# Z, o
<%, V7 U5 H& _: B3 \+ l( g2 \
temp = temp + 1;
& }; O' A! a$ k}6 H/ f7 j4 H* t/ t  ?
%>
3 \- p5 y6 ]% w* Z. rtemp=<%=temp%>;
% d! P- G1 A. C( y/ L! ?function changelocation(id){ & G: C1 D  E( r1 P9 ^1 ?! _
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 ' B+ L' J* U! C$ E0 M  N
var i = 0;
4 \/ i8 t+ Z9 fdocument.combo_box.city.options[0]=new option('-------',''); ; w$ q" `8 T$ [/ G" H5 l
for(i=0;i<temp;i++){
4 M8 v0 k0 G: Q6 Y5 fif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
! C! Z9 z* ?% R6 V& o5 Gdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); ' ~- c" a6 z; r, q- e1 b- i4 b* n
} . `/ F/ W. Q; f8 |) S% d& N/ t' v
} " g6 ], M5 C+ [! n3 e* C
} 4 X6 R0 v3 K5 q: u3 p
</script>) Z. \) P/ b3 ]4 ?/ s5 X, @8 s' }

1 z+ Y4 ?. q* e; R9 j4 ^$ O7 F. l<form name="combo_box">" A9 U. D+ H1 e% h" Q
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">" E" b6 `9 O& G4 q* b( k- D
  <tr height="24">5 G* o* p+ a/ S
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
* U* |" n' l1 Z- x' j/ H    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
1 w8 Q; C- ^* Z- z( D1 T    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
- d# A2 P7 g8 h" _7 Z    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>. M1 J$ }4 N4 b+ n3 R9 q
  </tr>
& `- n7 _$ K, E  <tr> 1 S. Q: S* w/ l" J
    <td>$ X3 b& [' Q8 Z( c3 z6 y
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
( F# K3 [4 @0 J: ~% U8 o3 @  <option value="0">请选择部门 ---></option>
' `9 h9 v0 r2 i' T( Y, I! ~6 t<%
( i8 x; H  ~8 \/ U' k, l: ^5 D    string sqld="select * from tdept";  m  V; l+ ~2 z* @3 H# R' b
stmt=conn.createstatement();
$ Q" P, ^, p2 b$ K/ k7 Frs=stmt.executequery(sqld);4 b( u, n2 ~8 i9 W
while(rs.next())
3 H% ^0 w& r1 \7 C' m{; q) ?; T; s' s! s7 W  |# N: A# v3 V& g
%>
1 f/ R: \( f. F# R3 c& b  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>. D" k# T/ ^( W# Y7 {; j
<%) g, z9 o- @/ b6 Q/ |( S6 c+ o
}8 j: \" c, R# \1 e
%>
0 \: L3 V- s0 O" h2 l( U# [  </select>
/ |  Z9 w, R9 G+ H7 P</td>0 M2 @% Y: m+ ~7 {
    <td>7 @( f4 y5 s$ }% f
  <select multiple id=city style="width:150;height:200" class="bgc">
' I1 ]2 f6 @1 T! M4 y  </select>
/ l: L+ `+ z" x% Z0 S</td>7 g1 O3 N' E! f+ [! H' D, Q# o
    <td nowrap align="center" class="bgc">- w) ^0 G( r. T  g
  <input type="button"  value="<<" class="buttons">
9 n, l  P. j( N' G6 c  <input type="button"  value=">>" class="buttons">
/ S: k* P) i, P" \2 w</td>
3 |3 C: f  p/ M2 n5 K5 D    <td>
# ~6 E& o8 O% v; h: T0 e# l  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc"># P; e( }' ~3 F4 L
  </select>2 B8 c* N! Q1 E3 g# C3 ?9 ~
</td>
& A; P0 ]) B( ?) a7 b# t5 ^$ O, _  </tr>4 E  y9 U$ o# U+ V3 M
    <tr class="bgc">
: F  f8 B8 Z$ n9 u# W# T6 I    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>1 v: c3 F' A+ v! n
  </tr># f8 v. ?' t! J( S% u$ _. n
</table>6 I  }4 t2 t6 A2 |2 C
</form>
# M- J3 k% G% C. Z<script language="javascript">
4 l' O, l, X* N% h//人名移动8 L8 x$ q: o! _5 a
function move(fbox, tbox) {' H2 {) c1 q6 r4 [
var arrfbox = new array();
. _" G; \- D! L. [4 {# v! ~var arrtbox = new array();+ Y; g/ d; l2 l1 b% Z
var arrlookup = new array();
% o+ p, a. |  |" fvar i;- }1 T7 K/ g8 ~8 n( `, z7 h: g$ M
for (i = 0; i < tbox.options.length; i++) {
7 R7 |+ G0 y) |: F2 I" |5 F$ Qarrlookup[tbox.options.text] = tbox.options.value;
: e( p) N& x7 F; V# r( farrtbox = tbox.options.text;5 }/ y" V* ~; q5 |
}
0 {, L3 v% r  }# I: e% F) D" Uvar flength = 0;# R7 S" F+ F# z5 c
var tlength = arrtbox.length;
, Z$ c& N5 B) H- l/ }/ Bfor(i = 0; i < fbox.options.length; i++) {( N5 r- O! t+ ~- v- E% \
arrlookup[fbox.options.text] = fbox.options.value;
. E% ~$ t' d# @% G2 Eif (fbox.options.selected && fbox.options.value != "") {
1 m3 l8 P+ d; v6 `2 A0 ]9 Oarrtbox[tlength] = fbox.options.text;
, P. z# X: `$ c4 U# }tlength++;. C6 `2 I/ J& `6 h, y
}
) L& f0 U8 q& telse {
- s) s. T1 m, J) D) p, {4 uarrfbox[flength] = fbox.options.text;
/ }2 Z& c8 k5 `9 B" P* J- }flength++;/ g6 X, |* w1 Z
   }
" O0 H9 P: {8 R& x, H+ \* u1 n2 l}3 z2 V6 ^7 G" U
arrfbox.sort();
8 }2 A+ u; Y3 Z6 b1 K+ p: Tarrtbox.sort();
5 d  g3 \* n% f
) T0 P6 r$ a2 [- h, y  Kfbox.length = 0;
. j; W$ v3 m& k6 G2 P- ztbox.length = 0;
! O; A% j& j0 K) T. c% e5 w. y1 qvar c;
$ f3 s8 M7 z! ifor(c = 0; c < arrfbox.length; c++) {: V& k: s7 j: ^7 C+ Z! j
var no = new option();
0 k; L0 K! M( Y  ]no.value = arrlookup[arrfbox[c]];- ?8 S( e% u6 E$ D" l. J
no.text = arrfbox[c];9 J4 a. h$ O9 m
fbox[c] = no;+ Z. I; t& k8 d( J
}- M* x8 u) w- D2 D* B$ b3 Z  e
for(c = 0; c < arrtbox.length; c++) {
: |% H- }+ X7 A0 e# u; M8 Jvar no = new option();( N6 R0 F/ ~) p3 y
no.value = arrlookup[arrtbox[c]];
* C7 j. A8 N, X; S4 Hno.text = arrtbox[c];
9 a! i8 V; X+ jtbox[c] = no;
8 T6 }! {, ^1 @+ ^0 Y) T   }, A/ U5 a5 `- B4 w
}
5 T0 o0 S: [* H6 x; s</script>
5 o- ]8 t4 q( h6 ?; r% F- z</body>
( _2 _1 ~$ d& M4 b





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