jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"1 M& Y+ D! D" n! b6 ^, }9 Y
      c pageencoding="gb2312"8 t* ~4 k; G  R; @
%>, Y  }# o7 k# F. P: t
<style>- p9 u4 R4 l6 @8 c" p: @
.f9{ font-size:9pt; }
.bgc{ background-color:#aecaf9; color: #0033ff }/ {( [% r4 u6 z
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;  ]% D3 I( O! R
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;
  padding:1px;, P" h; v: Z' I+ H! v+ p$ S
  margin:0px;}
</style>
<script language="javascript">) p1 T! m) i! v

: Y. a- z2 m, S/ W3 ^) N  R+ l( j# F</script>
0 s6 t9 W! t' ]: p; U<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
( k" F# l  W, a7 O$ [<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />  q. {. o! _: I0 w  V
<%
( x( l9 C# z( [% p3 [  cdatasource ds=new cdatasource();  //数据联结bean实例) y; ~# M+ L4 O$ H
  java.sql.connection conn=ds.getconnection();6 B% p% W7 g+ i. s1 ^: x' E
  java.sql.statement stmt=null;3 M$ J/ t" @' ^9 P  p; R
  java.sql.resultset rs=null;
9 ~, z7 k3 a7 ]/ e7 k- s# Y  cdatacheck dc=new cdatacheck();
1 C/ I8 t; k( m+ B4 L, |7 p; F%>, C' B3 S8 k8 l" x3 J9 [; l6 ~, w
<%
. F7 u- H8 m4 C8 A4 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";
4 i. \* ~) L+ o4 W& L& u4 A$ @stmt=conn.createstatement();. g1 m, ?7 W5 a5 x
rs=stmt.executequery(sqlu);
: t3 t4 S* e, j( Y0 j$ X%>5 l3 I& R5 R  C: x; `; B' A9 r2 R5 v
<script language='javascript'>' N. g" g7 I: @
arr = new array();
3 r) z* t& x) A' u<%  int temp=0;
* U3 s$ k2 Z* g/ Nwhile(rs.next())
  Y5 \/ _* n* p7 R. C, s{) W5 I2 K! E) c$ E# A
%>
0 {' ]% n: g7 R+ ^( A% Q& B6 [arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
  \9 ]' R+ K3 [% M& y/ F5 g<%
; v& j$ W" x0 Q) Gtemp = temp + 1;
- @2 E  d* ~0 ^* n9 L( s}
6 i" L8 R' t/ t5 b%>
" C2 B: \8 [' G2 O9 Btemp=<%=temp%>;, k& }& B& a" N
function changelocation(id){ ! t6 ^$ o) y. L$ S5 ]
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 6 j5 }8 y' I& ?- [* i
var i = 0;
8 W0 A) `9 s. ^) Q/ y' c; E# \" jdocument.combo_box.city.options[0]=new option('-------','');
" t* S+ B+ `# {# f# b4 L" Cfor(i=0;i<temp;i++){ # J/ c& p3 w: q. o5 K& `
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 9 P; K% \8 `$ T
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); , c6 k7 G0 E9 M8 K. ^% C6 K
}
( f6 e. L& m! j) S- O" r, X, O% k} . K4 S. E; z1 f) ?+ r9 ?+ K
} # P/ r& D. z0 {7 {7 ]& ?% b) t6 J
</script>3 q$ n7 l# {" l1 y1 O. K  l

. T& O% _( L1 N* a) Q0 k<form name="combo_box">! U. c; {0 t3 \1 m7 c. j& S
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
4 E! m8 g7 ^. V3 a9 H0 \( }. u$ o  <tr height="24">! ~+ |# t. h$ U  H2 f) H9 w3 d
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
/ L6 x3 i+ [9 c+ M: s: w <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>6 y( a$ u3 }( A! R5 p9 v8 z
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
' F; @* R" [7 H3 R <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>2 |8 f; ?$ }* q1 J7 L
  </tr>9 M& i: b% r. v2 x% D; e' C
  <tr> & `+ r! C* J5 D. o# T7 J/ i
<td>
6 o. Q7 \5 P6 l  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">5 O8 _& d* Y) U+ h) k
  <option value="0">请选择部门 ---></option>( o7 b  o' V. A$ w" h: W
<%
, _3 l2 D7 i% {1 c6 R string sqld="select * from tdept";: J2 a3 x+ Q, g7 E9 Y5 O& ^
stmt=conn.createstatement();
! q0 g8 ]1 ^4 ^- |  o* m' B% ?4 ars=stmt.executequery(sqld);
& w! M; l5 b7 g. X( z$ Lwhile(rs.next())
1 F4 B7 _5 J3 O- h; F{' k- j3 B) [/ t- x( o' P* g' o
%>$ Y; [% N" |9 w& `1 y
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
9 K7 l- @  e, G: g1 F& ^<%
( a# w6 ]3 k% _/ n, k: o# A}  r/ ^% G  {6 H! ^6 g$ F
%>
7 w5 N  N; N5 x  u' i& C  </select>- l7 l. V, K- O- e2 z4 j" C; d0 C
</td>. Q3 f  D& P3 S$ d, ?* b
<td>
: S$ m( D' H: {. V4 ~  <select multiple id=city style="width:150;height:200" class="bgc">. ]' t% B1 T& ~0 N5 Y. b' U
  </select>
' x" l( G. C' b4 e</td>( e3 Q! T9 i5 x% K4 v
<td nowrap align="center" class="bgc">) ?9 G4 N$ e, Q" @
  <input type="button"  value="<<" class="buttons">
/ c* t* s! L" R  L$ x0 Y6 ^  <input type="button"  value=">>" class="buttons">, I/ m5 P! T0 Q  w, P" B
</td>4 d; k+ H/ _4 K8 t; ?, i
<td>
7 [& F4 W  E& i/ a" a1 \  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">- D1 F. A) s9 m0 ]* s
  </select>
" |, X( U, X- K% B9 X5 H</td>
) I( Z4 e! r- i  </tr># o# A, C( n4 v2 ~2 _4 O
<tr class="bgc">
' w1 ^: I% I, W! L% o <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
' W8 A' Z) X# D4 |  </tr>
- P3 S5 l9 F. r# I! _- U5 n</table>
' y# t; @" B+ _( t; T</form>
! T7 Z% O+ Z+ c9 O. A4 r: t<script language="javascript">
0 j% ~4 F. [' V8 G+ y/ @. z//人名移动
5 s( `, }1 r1 I/ g5 C4 ^) rfunction move(fbox, tbox) {
! p/ J) B! i, f, C/ h' uvar arrfbox = new array();
1 y. R: L3 ]% pvar arrtbox = new array();
! Z1 E2 [6 e# N- l/ Ovar arrlookup = new array();! R) g5 s1 U2 M4 e
var i;) D& t4 w, @& A
for (i = 0; i < tbox.options.length; i++) {
# J( w$ c* ]7 a9 Y, s& tarrlookup[tbox.options.text] = tbox.options.value;
! q" r! h* K% \4 Earrtbox = tbox.options.text;+ Y, q) T3 n* e
}
* v# F. i3 j; l: ~* m# u0 O6 ?) V0 s8 ^var flength = 0;7 o# z( O. i- J8 |* M  v3 M
var tlength = arrtbox.length;1 o/ ]8 L4 v3 R$ Y
for(i = 0; i < fbox.options.length; i++) {
" G" n. g0 ]6 g, D; F, earrlookup[fbox.options.text] = fbox.options.value;& W4 b8 d  [- X
if (fbox.options.selected && fbox.options.value != "") {" P& i$ O! a1 P6 n2 v+ _' ]3 H8 n6 r
arrtbox[tlength] = fbox.options.text;
. e& Y! Z# L" I& j, L4 wtlength++;, _( @& {% {5 w6 H8 b6 z" P
}( [1 P. }2 K; R( c
else {
/ j9 U3 P  w& {" P( U1 W  |arrfbox[flength] = fbox.options.text;
6 e) a! j! W2 Nflength++;
* o2 @6 u/ z9 R. {; C8 I }* w8 ?( n% [/ Q$ y$ c5 g' U: Y% d
}
' T) q8 |0 V$ q7 X9 n3 b# r# Tarrfbox.sort();$ _( Y9 w$ _: D0 q: J
arrtbox.sort();
9 c2 c6 T  H3 R& @2 o9 @% [) G* @7 j1 m$ \4 X* T8 _; W
fbox.length = 0;
8 |+ Z" w, J/ A) m# n" etbox.length = 0;, A  z: J2 y4 P
var c;4 Q4 x# {1 T: j: o
for(c = 0; c < arrfbox.length; c++) {
& ^2 X7 Q2 P' N! X0 ^2 Mvar no = new option();- X; Z/ K0 |; h( b; h6 @
no.value = arrlookup[arrfbox[c]];, b& T/ S( Q2 _- y& p
no.text = arrfbox[c];
. a' [; o) e" f! Y; Y; ^fbox[c] = no;
3 V, F6 s, W$ Q8 R# R! s}' [" Z8 E% J2 O7 X- n3 u: `; h; e
for(c = 0; c < arrtbox.length; c++) {& U1 s. E& X2 B2 }6 @: P% u$ k
var no = new option();" e" d( Q$ m" U1 o! }
no.value = arrlookup[arrtbox[c]];( d* f1 d( w6 S( K/ q8 B  a- z3 O
no.text = arrtbox[c];
6 N6 g+ |: M0 U  K) Otbox[c] = no;
. y/ F( `: A& b6 T; e+ t; E3 H }
+ @- O$ G( }! n) H; M) u3 `}  i9 N8 W) T2 k; a
</script>2 d8 l1 G4 y; _" k' b& ^
</body>
3 M( x1 {, R5 s- F

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

返回列表

jsp+javascript打造级连菜单

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

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