返回列表 发帖

jsp+javascript打造级连菜单

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;": s7 I7 O) z7 ^- A* E1 V4 ^
         c pageencoding="gb2312"' j: \& v% x4 V
%>
' {! B* C8 T' Z7 h- r# E<style>
+ @4 V& o7 L1 H  |' O- N.f9{ font-size:9pt; }
' @: _) K& a; `.bgc{ background-color:#aecaf9; color: #0033ff }
, q6 ~2 C4 M  E. k.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;) W* h# E, S) k3 v7 v& u4 u$ |+ M
  border-bottom: solid 1px #4e7dc1;1 _+ V& |+ i( T8 z
  border-left: solid 1px #aecaf9;
. y/ s# J( N# o3 R6 ]  border-right: solid 1px #5679bd;# n4 l4 ^) ]- f5 W
  padding:1px;
  ^. z  S2 x, S7 h% o) w  margin:0px;}4 a% ^. I8 g/ ]( F$ G! `: r
</style>. O' }' A" \. K9 }
<script language="javascript">
' Z6 B. e, V( P0 p<!--9 K: v% I* b) ^* j4 E: K
function rv()
  s$ V0 J- B' M; l/ f+ Y{
3 D! p3 P, o; n6 A* g0 ^8 {  var val="";
) I: ]) q* E6 f( k6 P, u5 u9 w  for(i=0;i<combo_box.list2.length;i++){) Y3 q1 A! Q. x8 M
   val+=","+combo_box.list2.value;
. ?9 D, U# h+ ~) T6 e8 p  }
* U& x5 h7 [# u" W8 g+ X  if(val.charat(0)==","){: W+ w3 t2 ]; i! o: L! _
   val=val.substr(1,val.length);$ r  N, k- X/ p1 \
  }9 L- d- N( q: ]/ P
  opener.form1.frecname.value=val;; j; y9 {3 l0 v! Y
  self.close();% }5 B& [- ~) J# ?6 I# \
}
$ F0 C: |9 d4 K" s6 Y1 h4 V- v//-->2 y, c, k, d! a8 n+ A
</script>
+ `) H! d* ]' l1 U* o<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">' J7 j6 K! B5 r8 U) k
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
. G2 T* X' O6 x8 }# ~) F* T" S<%
5 v' [! i& F' S0 y, y3 G9 K0 \  cdatasource ds=new cdatasource();  //数据联结bean实例/ z: I/ h6 L9 o3 Z. `
  java.sql.connection conn=ds.getconnection();
5 X# i! h2 y$ }, j+ [  java.sql.statement stmt=null;% W7 n6 ?" m& [* k0 d) _8 H
  java.sql.resultset rs=null;, i& j$ L: I- @2 e2 e
  cdatacheck dc=new cdatacheck();! J( v. h/ V9 V# I. n# B
%>
. v! I; ~4 Y, ?$ c: ^6 z, A7 c9 S<%
; `% ]5 t& p3 i& J% r: jstring 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";
2 E5 \9 J5 Q/ L; Lstmt=conn.createstatement();5 @2 c1 L. ~& Z
rs=stmt.executequery(sqlu);: J- s; ^1 O+ f  j' k: h$ n- l- q5 N: B
%>
% a/ ~7 k  i; s<script language='javascript'>. M$ X( K' G6 [& A6 {7 a
arr = new array();# y- k9 P6 u3 v; ~: }1 \
<%  int temp=0;) k& r- C; |  x+ B4 y8 o) w
while(rs.next())2 f/ X' ?& U. E: x# i
{
2 s3 I! w( ]! k; ?; e%>
- h# O' N# _( p: ?3 Z- A1 z) sarr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");4 l  j% a) x1 I" e* }5 t: s
<%: D; m% I2 p% [
temp = temp + 1;
2 r: N! a/ S+ h2 x* o: s}
6 H% y& v$ p- e9 w- t5 r! t%>
; J$ y! A/ y! S8 S: I# Ktemp=<%=temp%>;
4 z2 h- @7 q( M6 Xfunction changelocation(id){
5 f7 }, O) n: t5 u; Qdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 5 [0 L+ [' {- N  {' o( N
var i = 0;
3 h9 l# Y7 Q( w4 @8 odocument.combo_box.city.options[0]=new option('-------','');
! c) ]4 |7 J) d" E  F$ Rfor(i=0;i<temp;i++){
. `! `0 V+ ]" L; Cif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
0 N8 @5 r3 `+ K% }4 ^document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
5 o% p) c4 _/ ~  ~0 T}
! O. s* x. t2 N. \9 G  d} - x5 Y3 I2 W- z. }5 C
}
* n: J# F3 e2 W/ ]7 ^</script>* K: ?1 V* W  v8 z( P; \5 Y

( W  U6 d8 p% w% t<form name="combo_box">
( x* Y9 C: D" `, F9 K2 H<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">4 ~2 s* h( W1 a8 c2 c/ k& {
  <tr height="24">
/ {2 |. y1 S3 ?3 }$ \' a/ }    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
* x% H/ d) D2 N4 x/ o    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
* m2 C: |7 \4 J4 G, T/ a    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
2 K; l0 e) S+ ]6 e$ u& X4 u% L    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
# @' y2 G0 Y7 m5 v4 \  </tr>
3 E. A3 p8 c) x9 b1 b; ~  <tr> - L2 ]+ \) \% M: W
    <td>- a# S/ |+ @4 z, n
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
: a# Z1 b" D* A9 o6 Y2 V( }% D  <option value="0">请选择部门 ---></option>6 x. u, ]6 H( \. W. ?/ d# ^
<%3 g6 a* w# s+ l) E
    string sqld="select * from tdept";
6 e2 q1 i3 P* H' \stmt=conn.createstatement();
: ^6 |7 ^% B; n3 rrs=stmt.executequery(sqld);
3 G+ t& m! b2 [  N2 Uwhile(rs.next())
# D) \. F8 v$ `5 w6 ~5 t) Q{
6 |, b/ J8 M- T! ^/ [$ i%>! f. I9 r; m" w0 e% A
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
( W( u7 p5 Z% Y  ^<%
4 p. L1 V0 Q9 i}
/ G# F8 y, w7 s7 N' a%> $ a0 b+ |( l" o7 h! ~
  </select>% \: n* h9 ~$ ~! m' i
</td>7 d+ A* f' `  j' ~6 z
    <td>" k9 `) f( K! T; p  c/ p4 U- w5 _
  <select multiple id=city style="width:150;height:200" class="bgc">5 B1 M, R8 K- s! N
  </select>
! {: f: j% V, R. @0 u" }2 K2 Z</td>! g) ]6 L; H  c  Q3 U; W( M
    <td nowrap align="center" class="bgc">% k, Z% D4 e/ v& \' O
  <input type="button"  value="<<" class="buttons">- W- C' h4 c; w& W% E9 V
  <input type="button"  value=">>" class="buttons">( F! U' u# I! ~$ a
</td>
  P/ W3 N1 @4 U& f" n, a    <td>% ?$ w  ^0 ~; b5 |  J( Q' ~) x
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
( j9 o+ J2 o: m: a  </select>% U2 y  ], h2 R. V: C; @5 m) j4 w1 {
</td>) }3 S: e. V7 e, F" V
  </tr>
7 ]- B8 ^, M7 T1 R) _6 v  H    <tr class="bgc"> * L" P9 }! J* K: o. F  J4 E
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>2 Q/ D9 n! j; K
  </tr>
& n! r- g' j+ w" j% b; N</table>7 k; L( t1 g' d2 E  I  K0 g3 e
</form>
* \1 Q- z& t6 G7 m" W2 Y<script language="javascript">
( V1 c# l. w" v, s" ]$ y: l//人名移动
' P4 |# c' k, r( W- T7 k, Z3 kfunction move(fbox, tbox) {
; x- Z7 w" L& n: Z0 r3 Nvar arrfbox = new array();
( R: _; d1 R4 _* ?var arrtbox = new array();
* r* Q: q8 o' S% H' cvar arrlookup = new array();- |/ d3 R( y- ]/ W1 y
var i;& n/ \6 X( j/ a+ r$ \# S0 V, s6 I
for (i = 0; i < tbox.options.length; i++) {& p# o5 L1 C1 f+ V) ?' `
arrlookup[tbox.options.text] = tbox.options.value;! F, c2 @& j. |# I$ Y
arrtbox = tbox.options.text;4 a% G. j; B+ ^
}
8 W2 a( d  L7 u: J9 N8 yvar flength = 0;2 v8 w* Y8 ^! a2 f2 P7 n0 [0 V5 ?
var tlength = arrtbox.length;
+ _# j/ t# Z6 Rfor(i = 0; i < fbox.options.length; i++) {' E% D( H' K) ]" f3 P
arrlookup[fbox.options.text] = fbox.options.value;
! t/ g5 c: o( X6 L9 Pif (fbox.options.selected && fbox.options.value != "") {
, e. g3 O1 L' N: K6 varrtbox[tlength] = fbox.options.text;
- A7 H6 }0 w& f3 ^# Ytlength++;
1 w2 {8 c2 X- m) v0 H3 s5 K}
9 R# ~! ~- [8 eelse {
$ R5 ~  n+ |4 p: s5 aarrfbox[flength] = fbox.options.text;* l# D- t1 e  T, v
flength++;. y  o  m6 }3 V
   }
* N$ V. k8 e- Q. @6 s. v}$ J% i2 F+ O7 c4 }; S
arrfbox.sort();& I7 ]3 D3 ~+ J/ T
arrtbox.sort();
$ i2 }; i, V( F& M8 ]( I, ~; c& }6 i3 R4 R9 I8 q8 K* A4 g9 I
fbox.length = 0;7 }. c# P% _: s; _
tbox.length = 0;
' }  y; z- D6 i- [( t4 y& E: Tvar c;
0 u+ `4 ^4 [& d1 n$ D7 o/ G/ Tfor(c = 0; c < arrfbox.length; c++) {
$ I8 o' O4 r8 `var no = new option();
, q' y0 R: A: E" j9 |no.value = arrlookup[arrfbox[c]];
9 b( r0 T; z4 Yno.text = arrfbox[c];/ o+ [& H- j3 D. k4 A
fbox[c] = no;/ h/ F6 F. S( l* k: C, _
}
8 _0 D! g# C8 {9 c; zfor(c = 0; c < arrtbox.length; c++) {
  y+ d2 T& z; y/ n3 avar no = new option();9 v' ^' d2 o6 D% q2 @. E, X& Q
no.value = arrlookup[arrtbox[c]];
" U  X- o/ |/ x% L6 a" a' T' ?2 `no.text = arrtbox[c];
- z$ _/ U$ V0 T5 E0 Xtbox[c] = no;
; o/ j$ w6 A% h& l- _' v5 H6 }   }* z7 q7 Q) ~7 e+ V6 J4 f
}" Q% K' |' L+ ]; L- f
</script>
8 R( ]/ _9 E" P6 `, n</body>/ P# w  X: B/ V

返回列表
【捌玖网络】已经运行: