Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"+ c9 w1 u' I) l  x$ x" O
         c pageencoding="gb2312"
! q6 Q2 k5 [9 \2 S+ p$ \%>. h" ]& d  ]  `2 }8 f
<style>
( g$ c) P" k8 k+ q+ P0 K. c) C6 L$ n.f9{ font-size:9pt; }
' J: J* m7 E8 H. W.bgc{ background-color:#aecaf9; color: #0033ff }% m6 |6 \1 z5 F9 {
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;7 }' k+ |) Q7 I. `1 P! K
  border-bottom: solid 1px #4e7dc1;7 H& m: L1 u6 s. w7 T7 J9 z
  border-left: solid 1px #aecaf9;" @$ k& @  U+ ?5 P" N, a" `  F
  border-right: solid 1px #5679bd;$ a8 H7 D$ p# z9 ^- z* h/ F
  padding:1px;) H5 J  y: A6 {4 Z& Y+ o
  margin:0px;}; B( u4 z1 N$ U5 z
</style>
$ v/ `7 O0 `# R6 b( L9 o<script language="javascript">7 {8 U. a, O7 j- C& ~
<!--  K4 @- a* H5 n  ^1 I
function rv()
+ ~: G, Q& |" N) [$ `+ B& v: E7 O{- q& i2 I4 ]4 K' J% P4 p# P' x
  var val="";7 o  V, F0 x3 S
  for(i=0;i<combo_box.list2.length;i++){& O* J3 B: t. M' Q  C
   val+=","+combo_box.list2.value;1 w' K2 S9 c' v* K) @1 o
  }
" w2 \7 G' o0 w* Q) i# X, ?% ]  if(val.charat(0)==","){4 W4 c1 s8 ^, `4 `
   val=val.substr(1,val.length);
$ ~8 x, Z6 C0 a, G( {, P  }0 a7 z& ?/ h! V# q9 [9 T* u) C
  opener.form1.frecname.value=val;1 Q7 V! a  ]* d) R- N. x+ H
  self.close();+ m* e0 J8 v4 J: t+ c& P
}# E9 M$ L6 G0 P! D
//-->
2 m8 g! R' E# G, T</script>/ X. g  Y* i3 w" t" \- S
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
4 m  p9 X: u$ J1 f# j<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />8 V1 k- G, J1 A- B- x* y+ I
<%) X0 H4 Q8 J) W
  cdatasource ds=new cdatasource();  //数据联结bean实例+ R; ^: p0 o  B/ Q1 }" q# R
  java.sql.connection conn=ds.getconnection();
% r) {2 ?! A1 T- v+ N2 y7 P  java.sql.statement stmt=null;
( R# S5 d! G$ o% z& E& e1 v4 B  java.sql.resultset rs=null;
" a2 X( v1 f. N* j' p: y; D4 S% o  cdatacheck dc=new cdatacheck();
! {$ C: m' C2 h) m%>4 |7 \( L1 U# C
<%' w- b4 Z! g5 E: E. 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";
' f4 R" R% q6 B% c7 s1 Q; a/ T- Fstmt=conn.createstatement();- G  g( ^0 Z# `. M
rs=stmt.executequery(sqlu);$ e! d9 y6 f5 h/ s+ w
%>) h. h' @- V9 J: s
<script language='javascript'>: l* i/ n5 |; M
arr = new array();
! S& G8 a, y! h0 p  R<%  int temp=0;
0 p! c/ ], `, |  s3 C) Iwhile(rs.next())
- K3 [2 j( Y$ G{' K# Z# U) S- z# p' q; n" f
%>
7 U: `: R# |2 ?  v# i& Q8 ?, L3 uarr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");" S6 }2 F9 h+ ^% L
<%2 p( D7 k- C7 H
temp = temp + 1;
; x+ H. q: d' i3 R}
$ c; F" H9 y8 D, k( [; R%>
" I) u' W# C: D& g6 p' Etemp=<%=temp%>;3 p0 Z3 e: t- P  x; [# j$ [  \4 x& Q
function changelocation(id){
8 g) a- o* p9 p% Edocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 9 i- j+ H  y( M% q4 G
var i = 0;
& k9 V( H" L7 v  v, l  Fdocument.combo_box.city.options[0]=new option('-------',''); * d4 Z4 ?0 _' n
for(i=0;i<temp;i++){
6 t" ^/ E2 O$ ?# qif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] ) v# i9 [- h# P3 Y. D0 n+ r4 O2 a
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
! b  G. o, {1 e& X" N8 A5 U} , S0 Y4 K/ E0 q" y* x
} * S+ J* g( ]: I9 e6 @
} ) c4 N: `; n" x0 D# p
</script>8 w. J% a) T" M! K/ b1 l

1 ]7 p$ h' H7 T8 M" E6 _<form name="combo_box">' x' U4 t: z# C6 e
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
' E, }- S& n& D7 X8 C  <tr height="24">) i7 A8 b+ ^6 A- m! ]! S" I
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
, G) a+ s  [# m( O1 |    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% E. e8 a0 e; i' D0 l+ m4 b    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>* j$ {- `+ d! g( F+ u$ s
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>% H) x3 L* l/ l  [" o3 i
  </tr>0 `" O5 v5 \7 |" Z1 b  c7 `" Q8 }3 B
  <tr> ) K; X4 \9 J9 i1 |
    <td>
$ W9 O  O$ [9 V& e: {  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
" ^* @, F/ [2 I' j! @+ U/ M( F  <option value="0">请选择部门 ---></option>, @& p/ o7 G, w% R9 S! P+ Z
<%# O* a3 X+ P' [" |! ?% r0 v
    string sqld="select * from tdept";" }8 r6 f9 j  w" R
stmt=conn.createstatement();3 k% f: [3 [- Q# J. n9 y
rs=stmt.executequery(sqld);; e0 W! G* L# ?- o* t; i
while(rs.next())
% M- U3 B; C+ @0 _{
3 b- d) ^& X0 V/ U$ E" f7 W%>9 V: q1 V* _2 k. D4 F7 F
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
. [9 ~5 H2 T0 t  ]( n  D6 f<%+ J* r5 M: }6 d2 q- B( a
}  l; j. ?; g( q( l8 s1 w
%>
, \: }9 Y0 U; s1 r# i& F  </select>
& G. l  S. ]% d) p6 I</td>9 f' [/ l8 N# q* ~$ {1 c. z
    <td>2 [' @9 [% j, H3 S. G- {% ]  `
  <select multiple id=city style="width:150;height:200" class="bgc">
! `/ z8 ]* v, j) f0 Z  </select>
) m! P7 ^" w. B, z) Q</td>
8 o4 L( }3 I& x* w    <td nowrap align="center" class="bgc">$ ?$ c/ ?- n& v, X* v  z0 M
  <input type="button"  value="<<" class="buttons">- d* [* G6 p3 n) M$ u1 u
  <input type="button"  value=">>" class="buttons">% n0 t9 e( h- A" h8 E% Q: y
</td>
; s0 I- K. U& O3 O    <td>) |5 q1 t& z8 }! b# K7 g
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
3 V7 k+ e, s6 I; H; @1 j  q2 Z3 f  </select>$ A- v( c% B0 @. T) L
</td>, e0 o6 L. y% v; z& i* g+ z) s
  </tr>
$ ?# g7 o3 H& S- r% a    <tr class="bgc"> 2 [$ [3 U2 p/ M. ?, N  r
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
) U9 i3 H2 {, `: L) g! _' k6 C" C  </tr>
- K& Z! s' G# ?) r' {* j3 I% @</table>1 Y! s' q, P' m% R! q1 z% A% l
</form># S4 x$ h6 Z6 C: T3 N
<script language="javascript">1 n- C9 |/ V- K# t4 h
//人名移动
3 [4 c. w8 q) a) J. x8 \! q# zfunction move(fbox, tbox) {+ f1 y3 Y& i( y; H% p) q, F
var arrfbox = new array();/ Z: S- _( N0 t& q. V0 T1 j2 L6 D. \
var arrtbox = new array();
  ^3 X, `. B6 T' s7 Qvar arrlookup = new array();$ Z  w/ K- q) J3 }! o! B2 }0 K
var i;0 u  C7 S* Q8 |* W" t. s+ y' X
for (i = 0; i < tbox.options.length; i++) {
9 H, m# @. H9 }) J4 {arrlookup[tbox.options.text] = tbox.options.value;
% d  ~) F! p& }0 M: Oarrtbox = tbox.options.text;$ A4 n5 |9 R9 [- W2 {9 {) u, {
}
, Z* g8 s) h3 T# W& D  |  }# Rvar flength = 0;. v  Q- @3 c4 \; [' ^' O
var tlength = arrtbox.length;
* Y+ I, E) a+ ~0 Bfor(i = 0; i < fbox.options.length; i++) {8 @, p# ]& H4 ^& Q: D
arrlookup[fbox.options.text] = fbox.options.value;
( U. q! g8 X. J3 D, Nif (fbox.options.selected && fbox.options.value != "") {
* _7 a9 G0 ^  x9 O, Harrtbox[tlength] = fbox.options.text;0 c, q% K# r8 f0 |8 I
tlength++;
1 y/ [" Z* G& {" |. i}
: C2 O, N: J+ a5 q  i6 \0 y8 `. Belse {2 \6 ?; k; Y5 g, W2 D2 M% k
arrfbox[flength] = fbox.options.text;
: E/ c* ~- `9 X/ h, ~: W/ `( [3 Fflength++;
  c% n( C' a! _   }
! o0 @, j/ t/ m+ y9 P8 G# F}
8 |6 E8 |; q9 b+ darrfbox.sort();* K: V9 B# u5 \/ H( g4 ~  s4 \' N9 W, F
arrtbox.sort();
. `* S" w2 H- g4 S! V
: l" @$ a. \2 t7 w* S$ t/ M5 G6 Zfbox.length = 0;
& _9 v+ ?# s5 g* p* E# Ltbox.length = 0;
( n1 P# j  j! z: i1 b$ m( ^$ G+ evar c;
: o9 b0 W( O* tfor(c = 0; c < arrfbox.length; c++) {1 j& O: t. S" L9 p
var no = new option();! ]& s3 r; x2 u$ F
no.value = arrlookup[arrfbox[c]];: S. t) X, \* ^' e$ j
no.text = arrfbox[c];
3 J" ?  n1 z3 W9 L* v1 _fbox[c] = no;. t  `" u- g' d* F: ~$ l
}
) s" A8 ~2 D7 tfor(c = 0; c < arrtbox.length; c++) {5 D6 f) p% K& T1 v" l
var no = new option();
) x( n7 m5 _& h/ tno.value = arrlookup[arrtbox[c]];
5 F0 n5 X0 |% C8 y" B5 Zno.text = arrtbox[c];
& F; @( g1 X/ {7 u# ctbox[c] = no;' U; C2 W) `* V5 L( G7 `/ B9 I
   }
) h' k) i/ P7 D* L8 d}
: P; V0 E# B7 t6 m! ~- h* q</script>
# C$ i$ ~: W7 m2 z</body>( g5 A# ?: W3 n" [6 `: j& Z





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