Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"- s0 d/ \* n$ b2 `* `0 g$ R
         c pageencoding="gb2312"
! T4 m" e& ]6 S4 h6 D: L3 U%># _; k: U$ z9 u$ ~& o% d
<style>
# P+ x2 s! o6 \- s.f9{ font-size:9pt; }
8 Y7 M% ?4 E6 O7 c/ ]8 w# a2 I.bgc{ background-color:#aecaf9; color: #0033ff }( M( G: I# d5 h8 A4 o! M& `! i
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;# S9 M* h" x! G3 n* n& S/ X, Z
  border-bottom: solid 1px #4e7dc1;0 T- K; V5 u% J) Z, w
  border-left: solid 1px #aecaf9;
) p9 H* q/ m" v" W! ~; }4 S5 C/ ?  border-right: solid 1px #5679bd;4 r+ K( G' l9 R' S1 r" r
  padding:1px;0 \0 O' K2 e/ `
  margin:0px;}9 Q3 }$ s3 j7 S
</style>7 }' _. z# [9 {3 f% X
<script language="javascript">
( w7 `6 d) V/ R& v' X<!--
1 O, b% c4 f5 S& s# c8 x* afunction rv()
+ X1 a7 p& Y( [4 K# n8 S{" |% f( b9 x/ R) W9 A# ]
  var val="";
7 B2 s6 U8 U/ k4 }( x  for(i=0;i<combo_box.list2.length;i++){
2 F7 q" h$ X+ J2 A  D   val+=","+combo_box.list2.value;, C8 e- X3 o! j/ Z1 \7 f
  }- \) v) [0 K) I' V
  if(val.charat(0)==","){
/ E" L. B2 i: q0 g   val=val.substr(1,val.length);
9 b9 ~  `5 G  O  }  n. a1 Y* d" F; T
  opener.form1.frecname.value=val;- ?0 t/ \$ c5 F
  self.close();' p" p, w3 _9 i3 S" V
}) r- {8 U! p0 C/ S& I
//-->
4 y. I8 t2 d6 H# p</script>* ?" y! H  l) F1 D, `
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
+ V/ G$ H9 }# R+ M, o4 j<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
" R1 G7 ]& W7 C8 i<%' y5 I$ n& Z5 N  }! \( d
  cdatasource ds=new cdatasource();  //数据联结bean实例
6 }$ @7 [: ?! e) p3 B1 @8 _% [  java.sql.connection conn=ds.getconnection();
& h; y& I/ Q, i# R3 g" K  java.sql.statement stmt=null;4 Y- q. x+ ^9 ?; |+ n
  java.sql.resultset rs=null;6 J2 M& v, g& {0 \4 R# [8 {8 k2 Z# C
  cdatacheck dc=new cdatacheck();. O* i0 u/ W  Q% D& ]
%>
2 m* @3 g' p6 e6 y; P( G<%
& q0 b% K! x! Ystring 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";; [) r9 q# c% [, e; |
stmt=conn.createstatement();
7 y+ H3 [& O9 A6 R' ors=stmt.executequery(sqlu);
9 x8 }& o  C# X2 R' J%>) g; I3 V1 T$ C" F
<script language='javascript'>  b! Y/ ]" @0 I. I
arr = new array();
- i3 ]1 ?4 A, E' ]<%  int temp=0;
! n4 p. o- b% E4 R5 `. @4 Iwhile(rs.next()): p8 c" |, T3 `* [0 h
{
* ?8 {; s2 e# M5 I7 z7 K6 i0 p1 a%>5 f( i) T6 [; z+ T
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
# w/ n6 F/ Y6 E. ~$ b<%# P1 r  e& ?) F( a' B3 L/ b
temp = temp + 1;; m4 n: o4 C6 G  S  y' l
}
1 d  n9 Q# F9 |% _% d%>7 K! S6 P8 R7 ~/ {' D' m( ~
temp=<%=temp%>;: I: C6 {6 C8 F% `! f# y: X
function changelocation(id){
8 P4 c- N( z+ `7 @$ J% xdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 # I" N9 Z$ h# u) m3 }) J1 N) N
var i = 0; - w5 z+ b- e8 J, l! W
document.combo_box.city.options[0]=new option('-------','');
" h* R& r/ r# H4 afor(i=0;i<temp;i++){ ! w5 D% Z) f7 S. }1 E0 L
if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
; J3 `% G# a9 W" L, j! R6 hdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
. ~8 A. i7 p" F' U6 [0 M} 3 x3 O, x! n' f
} 5 K( H, D0 c5 V: j1 Y) x4 ?
}
/ i4 X$ z5 \# c</script>4 W* o$ ]% v, ~* j4 t/ F

6 v% G4 |2 P2 O/ I1 s+ s) h' j9 C* G<form name="combo_box">
( y7 |( D' A/ O4 G# C<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">" r! g$ v3 F1 t) G3 C  D: F
  <tr height="24">
+ v$ Y0 v9 @* t" k1 Q9 U    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
; z) d: A  C; |1 z* X# v    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
$ X( y7 a$ u5 z4 Z) {    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>: q( I- K$ p7 \% C  O6 S4 t
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>8 f# }! ?! k& I8 f8 O
  </tr>
! r( |+ U. D; H3 W$ I  <tr>
2 F( j3 W: ]' H4 e0 O, j    <td>
0 e' }; t, [2 p# M$ O  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">9 B( n8 `) c4 `( e8 }1 C
  <option value="0">请选择部门 ---></option>0 A1 }) I% p8 Q4 ?9 Q3 }1 H& s4 w
<%
: h" N" L* K; ]/ Q0 E6 x* A! m    string sqld="select * from tdept";
" z" p& A3 k' i, b6 A8 O" Tstmt=conn.createstatement();
) d/ z8 E& n' D* C7 ]8 D+ Lrs=stmt.executequery(sqld);8 ?  F# `7 o# D
while(rs.next())
" H4 L& [/ d9 E0 G5 o{/ {8 T6 C: C" L: n* f/ l
%>
8 N* B3 m, L% \/ g3 r" B8 ?  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ g/ ]8 |; ]; W. ]' U; ]<%
: H$ ]7 [5 X+ p) N. y}
( N% a$ i9 p/ V. z. f' P%>
1 M  k- \$ W# P4 z1 G  </select># d, Z* K: O( j6 c) F3 @6 ~. e
</td>; q. B+ I2 K, \) A4 ]8 p: N
    <td>
! u" Z5 m5 u7 J" G/ B2 z  <select multiple id=city style="width:150;height:200" class="bgc">
) G8 F6 U. M1 E3 Q% O  </select>; ~. j6 s, D8 K' s) U
</td>
& ], _  M# ~8 s( P2 d4 ?- P$ X    <td nowrap align="center" class="bgc">. O# ]1 Z' ~3 F3 E6 @. K5 x
  <input type="button"  value="<<" class="buttons">  H, T9 m( i8 ^. ~
  <input type="button"  value=">>" class="buttons">
0 |7 w" F* e  O5 o</td>" b1 j( e, T) q& L/ f
    <td>
5 O2 s* w, r- o, z  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">( q: W& i2 H: J
  </select>
6 p+ M0 o/ ^, N$ M5 S8 j5 s; ]  z! I</td>
/ y) _9 q8 O( @' I  </tr>$ O5 D! _3 H  f
    <tr class="bgc"> & w9 K9 S5 S8 }8 t% d& Q$ M
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
  t2 }& g2 e% U" c  </tr>
4 ]4 L! D" Q8 w$ o</table>
5 w2 u: i8 ~  j8 c9 D6 z- i5 K4 r</form>
4 W+ b* _- D& `) t<script language="javascript">
6 \8 {1 T# U4 U. S//人名移动
, F" @* c! \) l* v0 ]function move(fbox, tbox) {( T4 e: A2 V/ g& N1 w5 f
var arrfbox = new array();
+ `* }* ^- R/ [: avar arrtbox = new array();
* r" k+ _9 k' @' g* Z( [% N' Svar arrlookup = new array();
" J: A& @* j, v, M+ @/ _  Uvar i;
) |" c6 }3 c/ n. y9 t# C) Dfor (i = 0; i < tbox.options.length; i++) {
) n5 E) e% g) _1 N7 L- Karrlookup[tbox.options.text] = tbox.options.value;& @! I8 ], z7 M: ]) a% ~' y
arrtbox = tbox.options.text;
9 e% {2 U1 |' p; s}
0 X! O- k' K6 Gvar flength = 0;& P7 l" g# d, }5 _# E5 n0 H
var tlength = arrtbox.length;
- z" C' c* a4 K/ n9 i  Ofor(i = 0; i < fbox.options.length; i++) {
+ x. g# {5 Y9 c' earrlookup[fbox.options.text] = fbox.options.value;
4 V+ i& P) l4 M9 Zif (fbox.options.selected && fbox.options.value != "") {# {, g0 U& a& L  M' i2 d% z* ]
arrtbox[tlength] = fbox.options.text;
! W! ]9 ?/ `+ c; T1 K5 Ttlength++;
4 P1 E  D2 v6 Z2 }) r; h2 \}; G  b6 N8 a+ l7 @% B6 {
else {
* k+ W  u- @* |6 d- sarrfbox[flength] = fbox.options.text;
4 d6 n5 `. a8 _6 J' h! sflength++;  l4 V$ t2 Q0 X* l8 W- o5 G
   }- N8 D, t, U, w+ `
}
$ z$ w) ^& f5 [+ V) iarrfbox.sort();
/ g$ }  L* y& E; x! Larrtbox.sort();
8 ^( _  @) g" u! v7 Z! E; j" b! b2 N& O+ U
fbox.length = 0;
: t1 S, }/ w3 q/ Btbox.length = 0;
1 B% G$ \6 i/ N! o/ L# tvar c;( m- {, d* _  C
for(c = 0; c < arrfbox.length; c++) {( u+ D, U: G6 y& t" D; y  Y6 v
var no = new option();
; b7 J. c$ @% X7 x8 B; B9 yno.value = arrlookup[arrfbox[c]];
% X1 a  J! d3 Z8 g) S' Z/ G0 qno.text = arrfbox[c];
7 ^& N8 U! \1 b$ ^1 v% q2 Rfbox[c] = no;
" r! I' P6 h5 e}
( L' ^& ?5 d5 U: s: ?" ?0 _for(c = 0; c < arrtbox.length; c++) {
! Q5 ?: q# o6 q( ?var no = new option();" I, b. s4 V' s% P
no.value = arrlookup[arrtbox[c]];( o8 d6 |' C/ H# j" P- _- D; r
no.text = arrtbox[c];6 U. ?% N# D! J3 [- b2 V  l
tbox[c] = no;
) r9 g* T4 h# C   }
) @% i4 j' `. {2 o% e7 s9 T  l}$ h# L3 \( m- I
</script>
+ Q6 R/ W; G' F' i</body>
7 H, U2 u; j! W6 _





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