jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"/ Y8 @1 r( ^9 p& @3 F' U+ \
%>
<style>
.f9{ font-size:9pt; }, E' S% Y8 J& J
.bgc{ background-color:#aecaf9; color: #0033ff }
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
  border-bottom: solid 1px #4e7dc1;5 {$ a; |5 }/ G! }
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;
  padding:1px;0 `: w7 n% j* F/ y- I0 T5 I' K; }
  margin:0px;}# D* W; n1 s5 q/ g! z
</style>- s/ _6 p. {3 T! a7 f
<script language="javascript">' E) \9 h2 E! Y) N3 k2 ~1 l
' l8 d& x+ c. H8 B4 e1 ^' |
</script>7 ^) `- K6 k1 v4 E1 h2 n8 @
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  w4 E3 a" [6 A" F' a  _. z7 A<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />. H! w* O$ a+ j' A
<%1 f$ ?3 W- a) H2 [7 P; z
  cdatasource ds=new cdatasource();  //数据联结bean实例. R( ?7 t( ^9 E! B
  java.sql.connection conn=ds.getconnection();
& y7 D! A0 w" N! {2 G  java.sql.statement stmt=null;
! u) r! X! o* m" n  java.sql.resultset rs=null;0 {+ ?# E3 b! V/ B" `
  cdatacheck dc=new cdatacheck();
) v) G  B9 N3 l' K9 C3 G& n; x%>
5 [2 U8 X- C9 \0 c<%
( c# _( d% ^4 V9 ^5 j3 G; d1 P/ Xstring 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";
$ J7 ]; Y4 w; m2 W3 B# Nstmt=conn.createstatement();
- N# Y2 U, |0 K8 d- V8 k" Qrs=stmt.executequery(sqlu);. K: w0 R8 C3 v' a/ j% B+ P; M9 h
%>4 M' O$ ]. N  h# C: ^8 x; M
<script language='javascript'>" H: E# P& H) [$ v
arr = new array();2 ~- S" ]0 k7 K  E3 f* a
<%  int temp=0;
1 v! \4 e9 C  t. Y9 [while(rs.next())
) c: i* k2 e( v2 r5 y4 v{9 m, c; E! A& T% j- q2 j! z$ j
%>( G1 `; V( n8 \/ N
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
# }0 ~" I* Y; S+ L<%/ }4 J! L% q) S
temp = temp + 1;( X& H2 y9 s1 K& G4 t1 [4 D: R1 I
}
) n/ ~9 q' Q* l- ^4 W% F/ k%>
2 p1 [* I: ]- c5 {+ H! d5 }0 K9 Utemp=<%=temp%>;
" I3 k) _6 F; V  y  M( t) J0 gfunction changelocation(id){ 7 H; y+ L- |. a4 Y  l/ V( O. w
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
4 z  r2 o: C3 W$ s$ evar i = 0; 8 |+ O0 \( {( j( I; x* d
document.combo_box.city.options[0]=new option('-------','');
& q: D* c8 y3 {, T3 xfor(i=0;i<temp;i++){ # B. N! G; g* t& J! P& S* ]' r
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 8 I* b. B5 L2 `. Q" W% [$ U: g
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
$ U3 |% A* e! D0 z+ Z$ Q5 k} ; k% l# H. M* f$ ]
}
, r& V- _3 t" i2 m} ) e* s- E+ ]: n6 y, }" M
</script>! h8 r% E8 z' H" G8 h. |& ?# Y) X

$ S' }. j! J( _7 ?<form name="combo_box">( Z7 W" c4 A1 [, b
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
% a- u1 c7 ~/ x( k: M# c8 \  <tr height="24">9 ?6 U/ {0 x+ C
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>3 n5 {3 h7 [- w! e% C
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>8 u, U. y9 ]" {5 X( t! j; t
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>2 v6 ~' ^% z) y! o7 x
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>5 @! C4 {3 F4 u5 h* P
  </tr>5 u# i" X1 F6 y: q- @' u4 Y9 @) W1 A
  <tr>
$ c/ V8 f, H4 i% _" m$ O <td>
3 f, ^' @  e  j/ ]$ o  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">: i" b# e7 D! e7 A1 e7 O
  <option value="0">请选择部门 ---></option>0 ?7 v& N% L% B& w4 T" e7 T# b
<%
- E( l9 T9 t, B+ c8 w string sqld="select * from tdept";
6 ^4 G2 g$ K# E9 T4 Z3 ?9 n' Z# nstmt=conn.createstatement();3 |4 |# G! Z1 k: ?
rs=stmt.executequery(sqld);9 J' ]! o  N  x
while(rs.next())
/ J8 q7 C+ e. U  u! L; M' d{8 B8 @/ p+ w+ ~+ q' l% I! [6 R" Z  s- x6 Z
%>1 `" v5 C4 ]4 c- A9 k! W' ^
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
, {4 c3 m/ m7 F/ I. x, K  z<%
9 _0 w" ~& T+ k+ ?$ q/ G+ v& v, M9 e- _}
: W  \0 }" Y# H% B& T; Y%>
: n5 X+ ~& k/ ]- B# t& C/ `0 e  </select>
2 C! X8 L' r  _% y+ s/ _</td>
4 y' A7 C9 Y( |5 B$ v9 t) H <td>
4 m, K! [0 v+ D4 {7 _- h6 K  <select multiple id=city style="width:150;height:200" class="bgc">+ F) c8 R) s7 \1 r
  </select>0 z, G. i3 N) H* C1 [! ^) f- d- E0 p
</td>& u) v: R6 s' M) ]" S; p/ R. W
<td nowrap align="center" class="bgc">
4 b+ A$ n. `, `0 V5 C. S  <input type="button"  value="<<" class="buttons">7 k6 d) T1 i$ }: b% h: P
  <input type="button"  value=">>" class="buttons">
, |- `& w9 z  }( U' Q( u1 M</td>
# `/ t8 d( Z$ c5 r <td>) M. F. C0 m# M% G1 g8 l- q
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">6 t" s6 J: O; d. o& @1 q+ a( Y
  </select>9 S' d6 T) J3 _# M) D
</td>+ D0 F8 \4 |# u: @: f! k6 p
  </tr>
4 O1 Y+ N1 \$ _% ?$ F8 E" b <tr class="bgc"> " u1 |4 m; B+ X$ w2 A
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>7 P" o  k$ h6 }2 p- b
  </tr>+ l& |+ E& z8 q2 I) K8 f
</table>5 v3 ^% V- W, M. D- @. m
</form>
/ t+ u, W4 f- N/ ]+ p<script language="javascript">
, x* W; x2 o' O//人名移动; [. I: W" U, d2 s$ W4 K; a
function move(fbox, tbox) {4 |9 |7 L% J9 U: }
var arrfbox = new array();
# [4 z7 w; `- u$ c& k$ svar arrtbox = new array();; O- m% a" X. U
var arrlookup = new array();
* x2 H9 D2 A% m% j6 Z5 Evar i;
' m$ ]1 Q1 @! q* Dfor (i = 0; i < tbox.options.length; i++) {- V) I/ x5 a" d5 }9 A" i
arrlookup[tbox.options.text] = tbox.options.value;2 s* c& ~+ w; a! c+ B* \
arrtbox = tbox.options.text;
. [8 ?' H+ L$ ^: j8 b}
$ X; D* d5 y' A9 tvar flength = 0;  F9 r* p/ ~1 ?
var tlength = arrtbox.length;
- t6 d( M( L6 V1 ^& @: Nfor(i = 0; i < fbox.options.length; i++) {) H5 i/ b: `/ c6 K, j
arrlookup[fbox.options.text] = fbox.options.value;' ^# N& J3 Q# p, x% b: E6 Y$ F
if (fbox.options.selected && fbox.options.value != "") {
+ X8 [. N  Q6 Y8 r2 f2 k; Farrtbox[tlength] = fbox.options.text;' M% h; t6 N4 n7 e- u
tlength++;: }* f$ H( e+ P+ Z2 Q3 A2 n
}5 }) G) h, M" q1 X7 D
else {
1 g# r6 ~6 m6 o4 x) m. X6 D. qarrfbox[flength] = fbox.options.text;; [" D& q& V3 b% l1 z) d
flength++;
# a- x8 H6 q5 K9 S  g) i1 w }
; n. O" b9 K, b& I6 F& V0 ^}
0 u: l( x& j" ?# a: g" F; v/ Larrfbox.sort();1 B; D; {! o7 T
arrtbox.sort();6 P" j4 ^. y3 O, ?& f! j! c
' w/ r. o- `; a( ^- {" y- Y
fbox.length = 0;+ r) Q+ v- A& B( H% K' ~3 Z
tbox.length = 0;7 B9 N  r% n4 S4 x# Y# |* v
var c;
) e9 C! C" l5 m% B3 z& Z. {! \% h- rfor(c = 0; c < arrfbox.length; c++) {! V8 |# [3 U; V& q2 F; @- Y& j
var no = new option();. l# J) W# S9 r
no.value = arrlookup[arrfbox[c]];! C! S) S* F& {/ w0 d. r7 u9 q3 E# @
no.text = arrfbox[c];
  B( u, {& w! d4 h) o' rfbox[c] = no;
) F6 f3 a( v* ]! m: y& S* f}
/ U1 S5 {& q. q2 q% K" Y, nfor(c = 0; c < arrtbox.length; c++) {7 c% G: ^' C3 ~+ U4 b
var no = new option();  k8 }; x$ D/ R( E+ T7 e+ D4 M
no.value = arrlookup[arrtbox[c]];
& f- J+ s; @% b6 z% Tno.text = arrtbox[c];3 N6 G6 j8 A0 E! }
tbox[c] = no;9 J( F: ]' x! M0 L, T$ }
}+ q; z. U9 Q. H# u5 E# d/ V
}9 [+ D. n8 m+ i6 i5 [4 T
</script>+ x4 z' ~& l5 v% h
</body>
( W' ^4 y( @8 {' c2 U( b1 ~

捌玖网络 89w.org----致力于站长学习交流

返回列表

jsp+javascript打造级连菜单

[收藏此主题] [关注此主题的新回复]

[通过 QQ、MSN 分享给朋友]