Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
. |9 z$ ^7 v  k8 f; C         c pageencoding="gb2312"
& o2 z8 U- T4 G) p7 u# J  S%>1 ?8 e/ V4 ~. n$ l9 h' ~& b* F
<style>
1 y# i5 X+ v! O$ O4 v) i.f9{ font-size:9pt; }4 A% u$ O& w4 W* B0 n! N
.bgc{ background-color:#aecaf9; color: #0033ff }
7 g. G- Y% m0 p( W: V+ Z* |* A0 [.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
6 i- _% ^( I2 v3 o  border-bottom: solid 1px #4e7dc1;
  \% w  F" }$ `* ^3 q( H) q' `4 `# E  border-left: solid 1px #aecaf9;1 b/ I* ~% Y9 K$ O% F$ f! Q
  border-right: solid 1px #5679bd;. [$ R' B# ^0 G4 z! }
  padding:1px;
1 l8 R6 p3 D& z. W1 z7 l  margin:0px;}
5 i; `9 ]' V# H( u</style>; D9 |- n' _; t
<script language="javascript">
& M& D; n) m# k<!--
4 m' Y0 C- n; |3 x8 }: sfunction rv()3 r8 T! ~, ~6 }5 R2 E3 I  T
{5 o( r) f6 F4 l+ l
  var val="";4 z7 t6 [6 u8 [3 G5 ?
  for(i=0;i<combo_box.list2.length;i++){$ f9 G. _# r3 Y2 A
   val+=","+combo_box.list2.value;. I: o, A" I3 w: ?0 e
  }
; W% ^' |- D4 f. `$ j: ~  if(val.charat(0)==","){; H" {5 U; j" C& J6 @
   val=val.substr(1,val.length);# W+ U  d1 J. c- u0 I) w- A8 g
  }
8 i4 I+ q. y" D% Q  opener.form1.frecname.value=val;
8 M+ A) C6 w) t5 ?$ N& E! N! s) g, q  self.close();
4 l+ y$ C6 n7 E: q}8 m2 D3 E, }7 W
//-->
- i9 x/ ], |  ?/ @! N9 R2 R</script>3 G" P* }# E+ V, M
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">3 e* D$ G9 B! ]" h4 d: E* E$ s: ?
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
, R; |! o) p% i2 P7 D' S/ ~<%
$ l+ \1 ~: D# v5 G( P9 l1 X  cdatasource ds=new cdatasource();  //数据联结bean实例2 e0 |1 k2 }- \: Y# M! `" ]; _! v
  java.sql.connection conn=ds.getconnection();
% f- J6 j, v! i2 H) B  java.sql.statement stmt=null;
& D& O4 s- ^8 @4 r  e+ ^  java.sql.resultset rs=null;
4 Y) H0 e8 o" u1 u& |7 y7 w  cdatacheck dc=new cdatacheck();
/ k4 F! O$ N7 |% Y) N- u0 f/ ~%>
( F3 _' w' g1 [8 O<%' O2 p% k# z1 U4 R7 r, _7 ], K1 x
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";
, v8 B( C% N  R+ v. `2 Y# Estmt=conn.createstatement();" f$ z: G; ?, L+ ~6 a0 N
rs=stmt.executequery(sqlu);
1 K3 R$ e3 `( R  ]. v  M2 X%>
/ A/ a4 k4 B0 J! x$ D<script language='javascript'>
6 s- d3 W, n" \* [) ~/ o$ varr = new array();
' j) l' Q5 L9 W5 Y# j$ E) @# l<%  int temp=0;
/ X: ?# z4 E* L6 y  V7 l% ~' P7 Kwhile(rs.next()), f* w2 A" {. f5 z6 C. q, D5 n8 y
{2 r5 ], Y3 K( B' q3 Y
%>) M: W2 f- h) B3 B# R
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
5 e0 K' Q" q1 r<%7 p# J9 I- U* @  r8 c
temp = temp + 1;( D: k# s- A/ V7 G8 ~! D7 h) P
}
! H3 M# P7 t/ W4 w%>7 ]" P$ c! G4 a2 u- p# [
temp=<%=temp%>;5 g& z% r1 [: Z; Y# j: \
function changelocation(id){
0 I/ G& @- r/ j8 S. P1 Qdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 ! f( j, s! |6 X! k1 S# T) n* p
var i = 0; : h4 T' X/ Q: ^
document.combo_box.city.options[0]=new option('-------',''); : v7 X& x0 p8 ]3 b* V: u2 ?- }+ Q5 p
for(i=0;i<temp;i++){
3 b. p1 p2 Z5 ?1 `# h2 fif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
. W6 y+ z' v! P6 e; ^9 c$ ]document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); ( H/ J  D9 q$ t% k5 Z/ H
} + }) B  a) f1 R6 g/ C: f1 `
} 8 \9 N5 p3 @7 Q5 D
}
/ f6 G9 a! a3 c7 ]& G% P# [</script>. \6 [# x; {& e( m4 u0 r

" ]1 w. @3 E; U: t% S4 L. I<form name="combo_box">
* g" e+ ^6 z7 g& a+ w5 X" \2 M<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">' [1 b* p$ g: O9 U6 x
  <tr height="24">
7 _* c$ B% P+ @    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>' |. J; S6 H9 {
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>5 d- e! f% H& m4 }3 K% \. a' z; ^! c
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>) F8 T" d" n& C5 S+ K
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
7 y/ N; }& h5 x: w, u  </tr>
- v/ u5 g* P. h2 S) T( I: X+ _  <tr>
3 B; ~4 e0 Q$ n1 [    <td>
) O9 B2 J: O4 e  p/ C1 m$ a  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
# D+ F) W( O0 g  O7 e$ I0 F  <option value="0">请选择部门 ---></option>) S9 Q6 R' X$ m0 p$ l9 w' [& i
<%' K5 I6 s( Z: }+ p) ?
    string sqld="select * from tdept";
1 F0 K: m* g1 C+ b4 ]& p$ D: |8 Fstmt=conn.createstatement();4 C9 b0 G5 q. O" S# `
rs=stmt.executequery(sqld);
0 b) I. f! h% C# cwhile(rs.next())' T' i' t9 S: W* w  Y/ N
{5 D5 c$ V- [; `0 v7 e
%>
" K, [; ?8 T9 |0 x  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
" T: C; R$ ]# [% M. `) o$ ?. t. ?<%
. x0 [6 a% V2 H* O}
1 @9 L8 b  j! \: ^7 i%>
1 P$ x9 d  [: q. `: N# G& X  </select>" ?* u' M: {% j% K. O
</td>; T! d7 n( w, P& r
    <td>, D2 A4 G1 I* _, K1 h- p
  <select multiple id=city style="width:150;height:200" class="bgc">+ `6 p* _8 O9 j/ U, b& ~
  </select>, }, V0 ~$ `6 w5 j8 n
</td>
9 |2 V9 G6 U7 J! O6 `, b1 R& c    <td nowrap align="center" class="bgc">; v  g' [4 G' B$ m- _& h& o9 }
  <input type="button"  value="<<" class="buttons">2 A! D+ b. C* S9 }+ Z& S/ L
  <input type="button"  value=">>" class="buttons">" W0 B/ f( _6 t3 o2 E& h% a1 ~1 ~/ y
</td>
' P' K3 m4 N. a4 Y    <td>% E+ }. K8 g8 R& x9 s0 V; Z
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">6 n; H7 l5 |# d2 J# O
  </select>
/ O* o" ?! h+ M- K9 g+ W9 O/ Y</td>
& K( \" W% j; B2 D  </tr>
- B5 ?2 u3 J1 Q  S& `3 s6 K    <tr class="bgc"> % l0 M" u+ n. L
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
5 T0 g7 b" W$ N  </tr>- Y. a/ q2 T+ l
</table>
' x" s& `5 N, L7 ~</form>
, @1 T5 M$ K0 B* A& ]<script language="javascript">4 m9 ~/ O; W: a3 Y
//人名移动9 N- D, R- S% c5 Z! ?! Q* ~: j% O
function move(fbox, tbox) {1 Z, {+ a" P8 T. e
var arrfbox = new array();: S0 @, e; W; d) [: J
var arrtbox = new array();
; R" n2 u1 g) {var arrlookup = new array();
; M0 a; k6 |$ l  Z. ivar i;
$ i, }1 y+ l! V$ m$ o- afor (i = 0; i < tbox.options.length; i++) {
- |9 n7 E  F& b5 o& o8 I7 jarrlookup[tbox.options.text] = tbox.options.value;
: \# j/ Q7 s. R8 j# Varrtbox = tbox.options.text;
( V. m( ]- `; ^- @/ P) n% V}
# h' x9 q' V# |+ y) k) ?8 C4 mvar flength = 0;
% j# a: e6 Z& Kvar tlength = arrtbox.length;5 z. B' k' u! Q
for(i = 0; i < fbox.options.length; i++) {
) ?& }$ I+ g' w) y- {arrlookup[fbox.options.text] = fbox.options.value;) E! Y% _* y9 s' G0 X# j; Y) _
if (fbox.options.selected && fbox.options.value != "") {% }9 B6 \' C- C/ m6 ]: x7 ^
arrtbox[tlength] = fbox.options.text;7 F: {# R  {8 {/ g
tlength++;
1 x; e4 |! d5 S3 Y- Y' d& B}
2 M' R# h5 K0 n8 Y) `, l: h  Oelse {
! j2 ~/ q# y( M! \2 larrfbox[flength] = fbox.options.text;: N' F% N! o% F) T7 l8 P5 a, W
flength++;
; R- n& [: ]  o; N7 o, b   }
/ B# y, L0 S8 o( T+ W0 g}$ I5 A  G7 M4 @) V3 `
arrfbox.sort();7 F9 N* f1 W# w* P. C' `  t
arrtbox.sort();9 ?% o$ H9 a3 D1 k  S0 d% Q" z
( ?; q  ]2 O5 m5 {! R- O
fbox.length = 0;  l8 r$ G$ G- y
tbox.length = 0;8 @2 t; _' K( R6 {* R1 n
var c;0 B" @* `6 c( D' N3 j) Y
for(c = 0; c < arrfbox.length; c++) {% N4 n% H7 D% N7 g
var no = new option();
, f% O. f& E& w; hno.value = arrlookup[arrfbox[c]];7 ]: @. b9 O, e/ l* O3 A" e
no.text = arrfbox[c];
: n6 A+ c$ y3 N1 t0 Lfbox[c] = no;
7 o2 W1 }* y7 v! v8 r% P% m}$ H4 |" x- C# c: N. k4 W! I6 t
for(c = 0; c < arrtbox.length; c++) {
7 P9 O" T1 F* i! z* V; a, e: nvar no = new option();* _* ~4 _& V$ F! A
no.value = arrlookup[arrtbox[c]];
1 f  ~% a1 V# \# ]) I3 _8 ^no.text = arrtbox[c];
# c- _. V$ b7 {2 D7 rtbox[c] = no;
. u2 [0 X& I2 I$ E2 B! Y   }
1 T) D1 s. o5 ^9 k- R" g}
$ l0 ^. y$ ]. a</script>: h/ n: ?: g5 Y. z7 X& a2 u1 b
</body>
8 i8 P! x/ R/ q  n





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