jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"+ S6 S% s- K  d1 V
      c pageencoding="gb2312"
%>, H. M1 D7 J, @9 a; n( F
<style>
.f9{ font-size:9pt; }
.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;+ r7 U. |5 Y8 C. _/ y
  border-bottom: solid 1px #4e7dc1;& c: K) u/ v+ R( J0 v; b
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;$ m( `, W& W, R4 y/ r
  padding:1px;
  margin:0px;}
</style>
<script language="javascript">- X- |9 {7 r1 }) p
- n2 |# j$ t! Y% g, C( Y# a* ]
</script>7 f8 C7 n% c# e) E9 v3 ^( A9 r. P
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
# h* o0 D  `5 c' @<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
7 f4 ?4 }) ~; t- M7 p<%! y" R! Q+ Y0 f8 F* Q
  cdatasource ds=new cdatasource();  //数据联结bean实例' f6 l0 F  e/ H5 ^3 ?: B: k3 R
  java.sql.connection conn=ds.getconnection();
4 p; x4 O; l: u, [7 v" A) D  java.sql.statement stmt=null;2 `3 f+ K7 Y9 j% B3 W
  java.sql.resultset rs=null;( R: X2 n. W- {
  cdatacheck dc=new cdatacheck();8 J: L" o$ ]9 l: A- P: f
%>& f9 n! V5 n; Z7 o$ ~( w" c
<%" p2 ?' n$ x1 S1 F' l
string 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";
' Y2 Z8 S" H" X, s7 N, \6 Ostmt=conn.createstatement();
4 M/ y6 O: w# ^8 k. Trs=stmt.executequery(sqlu);3 L3 ]$ o9 t3 E4 h
%>: b! U( a1 h+ F2 x
<script language='javascript'>
8 f% f6 {4 S6 o2 M4 b! r$ @arr = new array();+ f! j' n; d6 S6 H( |' b% K: p
<%  int temp=0;  p7 s. Q, i! q* H2 s+ u  V
while(rs.next())
) N/ g7 ^' J7 R( C" v; ?{, h- k; V) Y5 @! i8 N
%>: u; U1 ~' G0 ^8 U
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");$ ^& U( Z$ q8 ?# T
<%
8 B# ^6 G& u) `( _temp = temp + 1;1 B4 _/ V4 a' y# L
}
6 A, K6 L6 D2 T! G%>
' W2 ?3 N% R: d8 N6 rtemp=<%=temp%>;
, S' @0 s" q1 f# Q% _/ M  t) Qfunction changelocation(id){
$ ~( M" o/ ?3 U8 M1 T- Bdocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
/ U1 O, k2 b, Y/ L. J: V# P) Rvar i = 0; - {1 G3 t' _( z* e2 ?& W8 m
document.combo_box.city.options[0]=new option('-------','');
8 v3 ?% s5 ~: d2 M0 M4 Q; P1 a5 qfor(i=0;i<temp;i++){ $ V" f  _& L& o, y  Z4 y
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] ' s# p- C) [% b, L6 Z& O* L
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
1 s6 P* @1 u' S2 `) C- H, M}
+ i  e9 V/ G6 U) z} . e9 c* F1 j* m% f. q+ I
} ! t# a# [% ^* x6 X- {9 [! I! @
</script>1 ]5 W  n2 u9 v* j9 F8 ]( z8 i
! ^, G1 S* x# G; s5 p$ |( V% m
<form name="combo_box">. f; r1 S% P1 |
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
" T/ T; I* S2 X' g5 K. ~# n  <tr height="24">6 A! s! i* f. ]  V) c
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>: z& S% P7 \# r6 V
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>5 X2 b; f6 ~" a, [
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td># q" V7 u8 B1 S/ w) i! t, N
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
/ z0 I% B8 ]: \3 t/ z  </tr>
' U# i2 ~# C, b+ H* {  <tr>
. x& u1 V$ t7 G' L8 Z <td>
: M$ M! N1 i) q( F% Z  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">  m0 P7 Q  v& v2 X" K  S" k& Z
  <option value="0">请选择部门 ---></option>
' u$ H% k" C7 Y! f<%
" z0 {* W8 x! t. A string sqld="select * from tdept";/ t( i  m2 `" }( Z
stmt=conn.createstatement();
9 C" l0 y. S/ `) ors=stmt.executequery(sqld);7 L4 }. B! E3 y1 z0 a/ R4 `
while(rs.next())+ U$ E' Z' S1 f1 {1 @
{
* C! j9 ^# v$ W: Y%>
2 z& A+ ]* q) `$ a  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
* I$ y6 O. o5 l1 K' K) ?<%
% w$ W' ?! G7 }5 g}4 E: B9 s: B5 m7 |7 f+ t
%>
, w, \: z3 ]1 O2 _0 h: }  </select>
  Q- o; l7 [9 p$ L0 B- {</td>1 x% Z' e: y' x
<td>* ]( c" X7 {8 `" r8 E
  <select multiple id=city style="width:150;height:200" class="bgc">, D) q. C3 E  h& {1 S; M
  </select>3 A" k/ \5 T# W- _
</td>' i6 _8 B, @6 Z2 {* _# v3 o
<td nowrap align="center" class="bgc">
8 A5 N2 `; y5 L8 X. Z; e  <input type="button"  value="<<" class="buttons">! N6 v- P/ k; b, M4 L. ?
  <input type="button"  value=">>" class="buttons">
1 s  z- ?( j' c</td>
. n( B' u2 R3 [ <td>
$ |, v- t+ i3 O# R: K; [  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">" E" U( P9 z! I* E. ?: x% o5 c9 Q: l
  </select>
& ?& l9 |* ]4 ?2 ]7 k1 R</td>
0 \/ a9 N; f! ^6 H- D$ ^- q  </tr>
  _! M4 F( q. ^; r4 J <tr class="bgc">
7 }, r# g$ Q; I6 B; t! v3 S- H: [& v& p <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>, c5 s' x( f1 M- \, N! v8 a
  </tr>& k+ c% E% d6 D) y4 h
</table>
4 P8 M/ Z' L! b( C. [</form>
1 ]9 v+ b3 o/ b8 n* F1 _( U+ }<script language="javascript">( u$ f2 @( t; ~* V3 u3 r
//人名移动
; X% P6 r$ {1 |7 Y& Xfunction move(fbox, tbox) {9 V5 g1 J4 Y% x; m( n3 M7 e% p
var arrfbox = new array();' H. @+ I& p# S$ D0 K" B
var arrtbox = new array();0 y5 \9 Z: @. K1 p9 x1 j2 B2 T
var arrlookup = new array();' D! _$ H% V2 }1 M! z
var i;. F1 h- V% d$ m. |. m7 H
for (i = 0; i < tbox.options.length; i++) {/ P6 J9 P. i/ U) j! D: p, V2 I
arrlookup[tbox.options.text] = tbox.options.value;% K( J4 \, A) _7 D8 ?/ L
arrtbox = tbox.options.text;9 l7 W& @4 l& [$ R% w1 M6 z# T' f5 O
}
1 e3 I2 r5 H& D0 I$ R6 g% zvar flength = 0;+ i, H+ K9 P8 O# X& P* D4 ?
var tlength = arrtbox.length;
$ [# Y9 X9 D' C$ f7 Sfor(i = 0; i < fbox.options.length; i++) {
4 L3 Q4 b% \  C2 u1 D/ s( Varrlookup[fbox.options.text] = fbox.options.value;
8 W& @, {  T) s8 Uif (fbox.options.selected && fbox.options.value != "") {6 t- K1 F$ _* m# h
arrtbox[tlength] = fbox.options.text;& {5 n& l; P2 p+ l
tlength++;, [; a" n" V. X, R
}' P# N. _5 G2 \( I: t# a) n: P; `
else {
2 N  P9 i8 z: r; D3 }% b& ]8 Oarrfbox[flength] = fbox.options.text;; t9 P' c2 n0 C+ d7 S0 p( }0 K2 @& Z
flength++;1 I2 r' o% Q7 E2 i9 k
}
+ u; @- |& k% S2 d0 _}" a6 t  q. f# }! ^' `6 t) A
arrfbox.sort();
/ H* E( t& O& p' x6 a7 C! G4 parrtbox.sort();% g9 B/ c1 ^! h# ~
& }7 \* \: \& U+ [' V: d
fbox.length = 0;
$ M5 u/ z: i7 F+ Y2 H5 l6 Y9 Otbox.length = 0;$ [6 ]6 m- i% t- _
var c;
; Q; z/ w- n' G7 c" y- X! ]5 sfor(c = 0; c < arrfbox.length; c++) {. o" J" b: W  Y: G1 d* X* D# y
var no = new option();3 j+ y4 n4 l% w, [
no.value = arrlookup[arrfbox[c]];% R" u" V- V5 x/ |% c! L3 G: H. X
no.text = arrfbox[c];3 Y( x. E; X/ l
fbox[c] = no;8 N7 v' i8 D2 [0 j6 K. m
}( l& Y7 D3 h  N0 N/ P
for(c = 0; c < arrtbox.length; c++) {- H5 m  v, w9 G# d, O8 C
var no = new option();# V+ i. R$ A1 G1 ]3 Q  }
no.value = arrlookup[arrtbox[c]];
# c1 a( F- ~: R! A8 F# X) z, Hno.text = arrtbox[c];4 q, ~0 s, G6 B# ^3 F6 j( H4 o
tbox[c] = no;
0 h9 @8 P& {' o5 m7 z }
! t! o) s# s% I# B  s  D- J3 v}3 l4 j  p3 c$ A5 d6 |, [
</script>0 E. L3 K1 M: }4 u6 u* r
</body>$ T, s: x2 h' w: l# h7 T

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

返回列表

jsp+javascript打造级连菜单

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

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