Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"8 g* ~9 i, V3 Z' A0 g% e' `
         c pageencoding="gb2312"
, G$ i5 K6 z5 ^! g1 l3 A! E/ R%>
* w' g- M- J5 a+ r, c<style>5 ^0 H! N( Q) \2 O' B8 f: j
.f9{ font-size:9pt; }
% }* O2 O( {4 t" V.bgc{ background-color:#aecaf9; color: #0033ff }
  `0 o, d* n; \! w.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;6 L* Z2 a, k- d; C! U' w! E
  border-bottom: solid 1px #4e7dc1;
. S$ ]& ~+ l+ l; v. M  border-left: solid 1px #aecaf9;$ [' X  k- F- Z
  border-right: solid 1px #5679bd;7 y5 ~9 t( q- T* N
  padding:1px;
( r) B3 C+ Y8 A- M3 h6 c  margin:0px;}. j  }  E) q8 u, W( @  v1 f9 g( @
</style>
" o/ A0 r, s* X! q<script language="javascript">5 {% t% M# q9 z% v/ Z
<!--; T# y: H) q, ~0 s' Z
function rv(), ?; r, W) e0 b1 y& G  F
{
% N$ \( A' Z/ v" j/ a$ ?- t  var val="";
0 k) J- y" G  N* E) V  for(i=0;i<combo_box.list2.length;i++){
1 s7 N0 q) P# r5 c( j   val+=","+combo_box.list2.value;
% a8 `- B8 c2 K3 d4 ]  }
6 T; k; f' m: `  if(val.charat(0)==","){
% {! L0 ]! W2 d+ Z( H' Y   val=val.substr(1,val.length);3 T( C! B6 q' b1 E
  }9 d! j* Y5 x7 X5 e; b) g
  opener.form1.frecname.value=val;% s4 j' v; y# O8 `% O4 v3 h
  self.close();/ d! j  X- {8 O& A8 [
}
2 J! b0 g/ J0 z( p9 U6 q& P//-->
# H: V# n  [' S4 m+ O' @1 L</script>
) o4 A, V. c7 o' G<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">% ?1 W# e/ x" @1 |& |
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />- G- p. q3 T$ T. [4 x8 h3 T
<%
) _5 f! G  Z/ Q! [2 S- x7 l9 l  cdatasource ds=new cdatasource();  //数据联结bean实例
9 f: |; I6 G% a; U! `  java.sql.connection conn=ds.getconnection();
: H9 f% T. C% b5 X4 ?& o  java.sql.statement stmt=null;% r6 k) ~% x) s& I
  java.sql.resultset rs=null;  ?: @3 B1 H8 Y0 r. S7 N$ {" G
  cdatacheck dc=new cdatacheck();( c. s* N9 h* l* `1 c
%>
, @8 j7 _# _9 h0 |<%
  b' l2 m1 }, Y. Vstring 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";
/ q1 W- \8 @# O' fstmt=conn.createstatement();
  c- T% ]: F: a- C! H# Xrs=stmt.executequery(sqlu);& ]9 q# o* F) X5 r- W7 u3 M
%>: ?" c1 w! d, `% V
<script language='javascript'>
3 M% o  g# I& p+ l$ Rarr = new array();
2 ?. u# n0 {1 K5 v; i<%  int temp=0;
5 M, p3 K" A; wwhile(rs.next())
5 R& l) r. G' m' i{5 K( t% Z" ~& e+ |& _: [0 x
%>
. a6 B7 ^- }8 s1 iarr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
9 Y7 r* ]( e3 t  M<%0 A5 }5 [' H# {1 K! L
temp = temp + 1;
1 I: m8 X: p/ P/ P1 O9 L# k}9 ~$ n+ V- w) R- `) c8 c* T. `  u
%>
3 Z  o  |1 a: ]: b$ I5 etemp=<%=temp%>;' O/ Y0 N+ l; ~( y+ `- F# n
function changelocation(id){ 9 A5 `; c/ w1 X  R) \! ^/ u
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 : w8 T( N9 B1 s$ A' u# x' {2 z
var i = 0;
# o# t7 K9 u! {- Tdocument.combo_box.city.options[0]=new option('-------','');
" A' m" E$ b: O- B$ L5 ~for(i=0;i<temp;i++){
5 u3 m, f& e- {9 Y9 kif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 8 K/ p# d: M/ @# T
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); . V3 \: D/ S) G; b- d
}
/ P" Q$ k$ Z/ u9 K$ k}
9 Z& s1 R4 Q, Q$ J  S4 f! T}
) x% x" I) x$ y! U- F</script>
: T0 n" g- V4 a- `7 V3 t
1 u% @3 u+ U- n* z<form name="combo_box">
* R3 i# ?0 w) _- F; l+ G<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">1 O* x2 N* l& }" D( ]' t" Y0 D: T( D
  <tr height="24">" G: r: r6 x$ w, I
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
+ b6 I3 F" |" Y  A. y2 F8 p    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>1 B! U9 I+ r, Y3 n! }2 ~
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
* e( T7 q, Y( {    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>7 F" G3 T2 m0 c% ^1 V" P0 g' }
  </tr>; \+ u8 |7 [8 E8 g; Z! V6 ]
  <tr>
! h' F1 `$ a* `6 N6 o- x3 F3 k, J; o    <td>" P% p: r& P! _* c! M! @, c
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
. W( n4 n6 n# t+ j; n  <option value="0">请选择部门 ---></option>0 j+ q4 i; F1 v/ f4 x
<%' |6 [- \) J% F$ u5 j
    string sqld="select * from tdept";* v4 r1 B& J$ _2 H% ^2 D' b
stmt=conn.createstatement();" @8 T3 j0 l$ t/ p3 N" I
rs=stmt.executequery(sqld);5 u& A/ t9 r( j5 \" [
while(rs.next())% w3 X, u. ]$ r2 n9 o7 ?
{. {; g, V, f4 r) X+ K0 ~+ d1 `
%>
1 Q7 @" I3 U6 I) K. @" Q+ P' N  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
" ^5 p% p1 E: J2 k, {) }<%
* ~6 c! U4 D' k! _}) j% g1 w) N% d% b& C: g: d
%>
; ~! p+ x  h3 B; R1 {" y3 j- A  </select>
- X" \) [1 \  a+ q1 y3 h+ O</td>$ K' T- i9 a. y6 g6 |* }9 W$ U4 K+ C
    <td>
/ @9 X6 M2 M5 c' ]; \  <select multiple id=city style="width:150;height:200" class="bgc">! h3 l$ Z4 r& @9 ~
  </select>
* R& v3 \( N6 t</td>
5 V3 w* s# F9 P# J0 i    <td nowrap align="center" class="bgc">
0 _# ?8 |6 N. n# C  <input type="button"  value="<<" class="buttons">
2 I' t2 d- F( j% z  <input type="button"  value=">>" class="buttons">
" Q+ b* I1 ~; b3 U& X" f, _</td>
! G0 z* V3 P( p    <td>
$ g( R* m/ N. q9 x  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
4 R- N  s& b* R7 F% X; u  </select>6 j  s  d# E" b, n* A: k% @7 Z8 `( k& o
</td>
" I( H3 {# d9 N' n7 x, s  </tr>; s2 F8 \$ E1 T- `) ~) e+ c
    <tr class="bgc"> % V, ^3 s  O: W) V- f
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
2 T" o$ n: M9 D6 p# K: l$ w  </tr>+ y9 X( R- Q5 j* E2 [
</table>( w) H& a/ z7 i  D  ~8 V. A2 {& ~  D
</form>% U' h$ O+ ?. I( s1 d
<script language="javascript">
& X2 l( G$ \% F, n//人名移动9 u4 c5 }9 X; U: {9 S. D
function move(fbox, tbox) {
5 C: }& z0 l4 S" |5 xvar arrfbox = new array();
# c: J& ]# }  Y1 j, S1 Ivar arrtbox = new array();. K3 C1 }8 e1 w+ m2 H! r
var arrlookup = new array();
& L7 u0 m: t8 k! A% b+ Q' xvar i;
- Q5 P' @$ G# ^# Dfor (i = 0; i < tbox.options.length; i++) {
+ @) |, F8 ]" Zarrlookup[tbox.options.text] = tbox.options.value;
2 I8 R) o* F/ Garrtbox = tbox.options.text;) Q7 B1 a, n3 q& N' ?
}
# O" z) l5 I- r) K' c/ evar flength = 0;- H9 x: n* P/ }
var tlength = arrtbox.length;/ R# }$ Q7 Y# M/ D
for(i = 0; i < fbox.options.length; i++) {' z! J& p/ C$ [/ }0 B, w
arrlookup[fbox.options.text] = fbox.options.value;
# ~: `& ?! [5 [if (fbox.options.selected && fbox.options.value != "") {; }# X* M$ _# ^7 v& O# [7 ~! s# r  U. n
arrtbox[tlength] = fbox.options.text;1 c3 L6 s8 O0 O+ L! l
tlength++;# p2 C# T5 v; f: j; u: i6 M$ @) m
}
2 w0 }  O8 z) ]7 L, _+ jelse {* k- m1 Z4 k% H7 i
arrfbox[flength] = fbox.options.text;1 R* y) @5 H* \/ B: v( O) N
flength++;8 I' u# Q' ?) p0 k6 J+ z
   }
: \% J/ N" F, ^0 ?; v6 U}
3 D% P3 t1 w  Z8 R* f! farrfbox.sort();4 C" V8 f9 G- {5 w# }/ M- v, h
arrtbox.sort();; @, l4 P- h+ K# a$ X9 c

6 V, w2 ^+ M5 m  Y5 Rfbox.length = 0;
( h: s+ V! i7 G# ^tbox.length = 0;. q6 t- o' K+ v* t
var c;' B& C8 t4 q6 c& J- d
for(c = 0; c < arrfbox.length; c++) {; r/ f7 L. L& x7 V$ I$ a# u
var no = new option();5 f" J+ t( d* ]8 X8 i8 C
no.value = arrlookup[arrfbox[c]];
8 d% E) E4 i) w$ f2 Mno.text = arrfbox[c];
) H  g9 ]+ i5 Zfbox[c] = no;
4 H; _2 ^' d: @' s% }' R, V& L, h}
5 q+ R- V/ ~! c, b2 V" ~for(c = 0; c < arrtbox.length; c++) {- F" c- _& ^1 N) V. C4 S( l% a
var no = new option();
6 z+ I6 l6 J9 `- |! Q- Rno.value = arrlookup[arrtbox[c]];* h, B7 I/ x) N; M" W1 n+ N
no.text = arrtbox[c];! [" N' K: z$ s, N
tbox[c] = no;. }2 f, M1 @& y
   }
: G( \. g) @; X8 c5 L}
; x: j# T7 ?6 f  Y</script>0 a- u" J2 O! u
</body>& R3 t, C0 |- B) l% b" z





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