jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"- @- c! x% r7 r
      c pageencoding="gb2312"4 E1 J3 J* @! v
%>7 r5 G$ U. x9 P0 }; b* e6 q- ^
<style>. _7 ~' d4 D0 k( E+ X/ c% C
.f9{ font-size:9pt; }7 E# C) E# _8 w5 f- ]
.bgc{ background-color:#aecaf9; color: #0033ff }$ ?2 Y; G4 [" n- Z* y# l
.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;
  border-left: solid 1px #aecaf9;" }, _8 a7 V$ G9 e& ^
  border-right: solid 1px #5679bd;
  padding:1px;( @, ~9 B) i- s
  margin:0px;}4 Q+ c5 T# M0 s# g- g
</style>3 R  e3 \* ]5 R  j8 O
<script language="javascript">6 Y( t! |4 ]5 P7 h2 c

( s. ^' u9 }. Z</script>3 H4 s! N2 t2 I
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
! J/ R% h# S6 G* w; c+ d9 W<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
! r3 {* D4 E- O0 X<%' o6 E  @5 i7 ^: u
  cdatasource ds=new cdatasource();  //数据联结bean实例
% u& {* O% y) ~  java.sql.connection conn=ds.getconnection();
5 X/ Y" U$ O& ^( l  java.sql.statement stmt=null;8 T* ?3 E! b6 E6 e0 z/ h
  java.sql.resultset rs=null;) ?2 W* J8 B; G+ \" [% C
  cdatacheck dc=new cdatacheck();  ~0 \! ?5 R% W6 T/ e2 {2 |
%>: o1 ~/ w+ l6 a2 H2 q
<%
% b/ r: @/ E9 x7 Bstring 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 Z) |. t; a2 q0 P/ w$ Xstmt=conn.createstatement();, |. c* s: u- T2 k  J. \; L  y
rs=stmt.executequery(sqlu);6 Z( p9 u. {4 I7 R3 X5 k! u& f
%>
; @9 C& _6 s! _& K# H6 S<script language='javascript'>) j& j( f$ B+ z' F& F& \" @
arr = new array();
" L9 |: ^* H) {1 z<%  int temp=0;: \- i. N4 z  V
while(rs.next())
2 C$ }( P2 B+ P' D) Z* F& t{, n$ [' z7 ]+ P" Y. P
%>
/ r# x4 @1 U# sarr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");# V. w; L; r9 z5 b* ^; d
<%3 \1 R; g& c  v! N# |4 h
temp = temp + 1;( ?& V8 R$ L0 F! I0 A+ [
}. ]6 i4 x7 g0 f- Z# k; ?
%>
# ?& t0 f7 t7 z3 ktemp=<%=temp%>;+ ^& G; @. `$ {! k; e
function changelocation(id){ - \, W+ s7 ?6 j" q+ `' T
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 - ?0 ]! h  W3 R- _3 @3 U1 `6 m
var i = 0;
+ L0 o% ]% |( O5 q+ Wdocument.combo_box.city.options[0]=new option('-------','');
7 R, M- s' s( h, Kfor(i=0;i<temp;i++){ " _9 R2 [9 V% t* E2 p
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
6 n  i0 j. b& r/ }: H2 g5 g) Sdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
7 M; r+ M, V, j1 p- [1 Z3 L+ [  H}
( o4 U1 W- B( U6 ^% U! G- f}
$ o& M  _& X$ s& i+ Z0 G} % h* p7 i% Z5 g% o
</script>2 F* W1 D" d- z% M

: V5 ^3 z, R8 r8 a<form name="combo_box">5 t; Z% ^- b. c$ l' i+ Y
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">' @9 T5 c: D/ A2 ~2 _3 @" h+ q3 v
  <tr height="24">* {; p5 o, k" s# b* N, [3 W2 ?" f
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>2 i. x! G! L- w6 V8 E; H7 c: w
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>) T8 F5 M/ S+ s' T
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
* J3 ^# t/ ^% y. n* q' g7 C8 Y' U <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>: W* w/ D# `- Y2 z" ~
  </tr>. V( M6 w6 d/ o3 T' c1 z5 I
  <tr> $ D  ]2 P" O: z" F( R% U' n0 `; C
<td>
$ d+ I2 \# ?, W" Y- I( x  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
+ j, ^* F! @# a, I: ?9 W! _  <option value="0">请选择部门 ---></option>
' [  O1 k% L' C* D( L$ Z' {% a<%6 T) q3 o( c+ W4 C* O; N, h
string sqld="select * from tdept";: h) K  R) I' y! b+ A- V" l6 J7 q% C6 z
stmt=conn.createstatement();
* u9 W5 U: T' `1 g* c- x( @rs=stmt.executequery(sqld);
' U0 A  }2 Z1 @2 n4 lwhile(rs.next())
$ `& |0 G7 \9 f! d. Q{! r( k! L7 T0 A$ w
%>
) I8 r; Q, Q1 B2 V* ^. E4 \; ^, y  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>  h2 {6 d+ Q: E/ v& a+ x
<%
+ G: E+ d5 v9 W}
& ~! m; z1 h  {( y1 E9 T( l$ \%> % j! C( _' j5 Y) F1 g, b
  </select>4 ~' t+ Y0 E0 [5 o  z. S$ Q7 c8 W
</td>( g$ F& z( M9 z* C( r
<td>
( `# S. V, T( D4 O  <select multiple id=city style="width:150;height:200" class="bgc">$ r# y( k( I$ F; t% k9 x
  </select>
1 Q$ G+ T1 g/ M</td>9 k! p! N  \$ N9 w* L) A8 w. N
<td nowrap align="center" class="bgc">) K+ a1 T# g1 ]5 n
  <input type="button"  value="<<" class="buttons">
4 I- n% q0 M6 Z/ {4 ^/ v' Q4 X5 M  <input type="button"  value=">>" class="buttons">
& ~) e/ q" D: D# ^8 w# T7 |0 Y</td>
9 O- J4 y# I7 |3 ~ <td>
+ a+ F6 }& Q' |+ C0 T( x( J  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
5 r1 V% _2 J- D2 j  </select>
' `. G4 c  t- \: m  R</td>9 @3 |$ R$ N% B; C* S. g
  </tr>  e( \) L% P" S: Y7 \7 e
<tr class="bgc"> 9 b' b. [# g8 M2 R" ]; P3 b
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>  f# i3 ]- h) I! e3 Y6 C+ ^1 [! W
  </tr>
9 s- \5 z1 z7 G  P</table>& {, n* \+ p, ]/ o/ ~$ `
</form>
/ v+ }6 ]# i1 C  u6 z' C: C& `<script language="javascript">4 V9 Z; K( N  G! a( q7 Y
//人名移动( c8 q8 p2 R7 z3 Y
function move(fbox, tbox) {
6 [; g+ J, |# qvar arrfbox = new array();
! T, ~/ z, Y( z5 S1 C% Y# A, [var arrtbox = new array();
2 j  Y/ n% Y3 N& pvar arrlookup = new array();7 g0 h$ P0 k" N8 D* ~% D
var i;
7 O6 l; g$ e' ffor (i = 0; i < tbox.options.length; i++) {2 y2 V; g# M* K& x( v& L, d
arrlookup[tbox.options.text] = tbox.options.value;
0 e1 a( b& p$ X; _% }3 B% j. ^arrtbox = tbox.options.text;
; i$ e# n% p3 k0 W: S. ^}0 k" o2 c1 J1 V" F" \/ i3 ?6 w0 D
var flength = 0;  {0 G1 w' B# ~0 M* m' p9 p' H6 G
var tlength = arrtbox.length;
. C2 l$ J5 T8 u1 @/ Cfor(i = 0; i < fbox.options.length; i++) {
6 k2 n, Z( I+ E$ n) V& l* a7 b* jarrlookup[fbox.options.text] = fbox.options.value;0 j1 V  h2 K; m
if (fbox.options.selected && fbox.options.value != "") {4 O4 c! m6 a- }: W, j: }0 _
arrtbox[tlength] = fbox.options.text;
6 S; N2 \" h( ztlength++;  p+ ~. J# `1 K7 I) q
}9 h1 q8 J+ a: W( t
else {
0 T, f9 q! t, a! G6 Z# w0 @arrfbox[flength] = fbox.options.text;" P' I( v) ^, ^* o9 D$ c8 h3 k2 }
flength++;
}+ n# [7 \# b4 p0 w; Y; ^
}
6 u0 M; T" F3 r. q3 W8 R9 Harrfbox.sort();
* v6 ?1 ?$ F# D$ iarrtbox.sort();: w8 |! y/ f& P! h5 p# {% `
1 F3 q, `) }3 b* A) Z5 ?1 w$ Q
fbox.length = 0;
; j) K, G4 y9 U; L; qtbox.length = 0;
3 X2 T* @" e  b6 N. g6 Cvar c;$ C: ^6 }* \8 \  Y. X6 x
for(c = 0; c < arrfbox.length; c++) {" h' J) ^7 d8 N7 T2 k
var no = new option();. m* K( X0 y1 ?0 X3 r: W
no.value = arrlookup[arrfbox[c]];8 S4 }" c) O7 s2 Q9 q; N
no.text = arrfbox[c];+ c' _9 B3 S. k# Q7 K$ g
fbox[c] = no;
3 J$ f$ `! [5 q. e! j# L. j}4 w" }1 y5 _3 m& E6 [4 H2 c
for(c = 0; c < arrtbox.length; c++) {; ?# ~/ c4 S, [  q4 O0 ]- \
var no = new option();
) K7 p) m1 C6 r# u. g$ K, L1 L, Vno.value = arrlookup[arrtbox[c]];, [3 |2 g+ b2 U
no.text = arrtbox[c];8 ?8 E& @, I# c& z; K* {1 j
tbox[c] = no;  N6 f; @: I" K) u; N. T
}
  f0 ]- w' E3 }1 l6 z0 l$ K}, {7 j: q0 D: c- q9 W# f
</script>/ c2 F) V' P7 w# f, k; j( H& b8 h5 i9 H
</body># f0 P5 L8 R7 {1 v" h' E5 D

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

返回列表

jsp+javascript打造级连菜单

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

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