jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"6 H0 k- _/ U7 a% f9 g; |2 B
      c pageencoding="gb2312"( A' }: b; l/ v, a& z8 M1 d+ }4 g
%>
<style>
.f9{ font-size:9pt; }: n8 i/ g  Q! M3 {
.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;
  border-left: solid 1px #aecaf9;$ }! }+ d: ~& ?; n, ]6 v
  border-right: solid 1px #5679bd;
  padding:1px;! F3 U) K7 |' Q1 k; H0 \
  margin:0px;}
</style>
<script language="javascript">
7 H% v; J2 W- Y! M) I
</script>7 L; T) m5 j0 c/ T% b2 V
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
  C% m' E, v  u8 d" f% V$ b<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />7 u4 x$ K) M6 I: Y6 o: |+ K
<%  r4 h( _  m2 F, n# e3 F/ V
  cdatasource ds=new cdatasource();  //数据联结bean实例
& T6 e9 C; w1 u" r& ?" \  java.sql.connection conn=ds.getconnection();- b6 f. A& E. M+ d8 B0 e$ H1 K$ u' @
  java.sql.statement stmt=null;
6 ~% H/ ]. k- n3 b/ h  java.sql.resultset rs=null;; U: w# x5 V0 y! X5 c
  cdatacheck dc=new cdatacheck();
* y$ ^! `. I5 {+ @! O3 ]% |  o%>
& t: U* A2 [- O* n) |+ T3 x<%
  d  [# G) p7 }) \) V6 Lstring 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";$ {$ p9 G( @3 E9 x) ^' t
stmt=conn.createstatement();
! ~  {' O  G1 _0 N- brs=stmt.executequery(sqlu);# y0 Z+ B! W8 F5 z
%>
5 a- u$ d. I, \/ O) g' \: u<script language='javascript'>
( q% ~0 o% }& T& earr = new array();% W% f  h  F4 t0 O% i
<%  int temp=0;* m+ g, ^, A; j7 F
while(rs.next())
9 B: s2 ?6 P6 v' @8 V3 M# u$ |9 {{
2 y. d8 d0 u0 F9 X) H%>
. f0 o( [/ a; g" B) E3 p: j, ?- _arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");2 m# u, W9 K! S4 l$ e. j; ]
<%! W! T8 z" Q; |: h
temp = temp + 1;+ V( |1 b0 f$ _* h" y
}
" a1 m" _* ?2 u' n: r9 v%>9 F" |: F. A' Q# o: \) l/ j( K- J
temp=<%=temp%>;
# f3 _0 Q0 Q5 v" ^8 n. {5 o7 Ofunction changelocation(id){ 4 R$ }8 K5 R0 t8 j+ C" A/ I$ Q6 M
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 ' i2 [+ B5 b" d7 k, F5 m
var i = 0;
* s0 P3 O6 c  x5 z+ M$ ^& D( Edocument.combo_box.city.options[0]=new option('-------',''); + l0 N  k& K  M1 O7 A# {/ k7 l9 C
for(i=0;i<temp;i++){ 3 ?+ {- L% }* f- Y& G8 A9 B# T& d
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
( m( }4 Z3 T' T# O0 j8 t" M1 z1 Ddocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); * m) U0 x) k; g. o
} $ y& F( s4 n% ?; b+ ]2 r* F9 [
}
  |6 f; Z8 A7 q" x0 K} + f5 c) C, _- i, w# Z2 y! X
</script>4 i7 d- ]  X9 Z9 f; I

' O: T* P9 J: P7 Y3 @8 E2 i$ f<form name="combo_box">$ I/ @' o, Q1 ]5 c0 Z) m# g, C
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">  E% f+ a3 O6 V- x2 T2 y( l0 w- H
  <tr height="24">
( v6 w) ?& }# w' E( v7 C/ o+ L <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
& w, v6 X( c& P' [; g <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>' N3 \% z0 a2 o$ e- I2 ]
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>4 Q8 \+ j6 P) o8 `
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>6 g* o/ z+ Z( B0 O* K. `
  </tr>
# B5 R; \, Z$ l9 i& S" n" Q0 f  <tr> ! v/ i' q7 ?" x, U
<td>' _8 i4 U0 t2 C4 ]; W
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
8 [: t+ N2 k& L  <option value="0">请选择部门 ---></option>5 c, Y6 q% p: h2 g  g" X, J
<%
) N7 h% o' d+ H  |! U string sqld="select * from tdept";) ~, S( o5 d  ]8 {
stmt=conn.createstatement();5 l# Q- X, \$ G- c& |6 H5 H
rs=stmt.executequery(sqld);- U  a0 z6 s5 m
while(rs.next())2 }5 B- U6 T$ g! T& J# l
{
0 {* S) M& S4 S6 i: V3 v%>9 Y* v9 m$ p' V" v  I9 ?" Y
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>  u+ e& n1 ?  `3 J. Q7 I3 _
<%3 ?, x3 {3 c0 w, t
}/ j8 `3 J4 \3 i9 j0 x! W3 e
%>
5 t' U- `3 Z' _0 Z  </select>% J; n- C3 n2 D* e5 C
</td>0 F7 r/ W( u6 b4 l2 C# x! X
<td>$ j5 d! W9 L- ^9 Q1 z
  <select multiple id=city style="width:150;height:200" class="bgc">
3 [4 ]! V; V( V! P, S4 T+ Y) v2 @  </select>
( O- F" n( F% k: W, S9 k, b</td>
  ]; r' b) E7 x; K8 T/ v* E <td nowrap align="center" class="bgc">
2 B: ^9 L" D7 o# |4 A6 J  <input type="button"  value="<<" class="buttons">
" i& u: p% p1 o2 d2 J" c  <input type="button"  value=">>" class="buttons">
" y8 w1 f1 q* B" z' _  H</td>8 D. u+ J) N& c" Z! |
<td>
! w4 B5 w9 K- h. `4 H5 R8 ~  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">" ^( E7 l' {, d+ L% G
  </select>
1 a9 V) K  L: E( O</td>7 S& Z$ e) q: R, W
  </tr>/ f+ b; `9 N4 \9 v7 _6 |8 x
<tr class="bgc">
8 L! v) s8 T3 P, `) U8 Q <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>, c9 ~& B/ d& @: b
  </tr>! m7 p7 w# q# w- G# ?
</table>; W+ k$ ~: R2 P7 X, H
</form>
; a( D3 U9 i- _$ K# g! A/ w<script language="javascript">
4 ?1 v7 X- j7 j//人名移动
, }) R" l) C4 I! k- ofunction move(fbox, tbox) {1 \( ~' {2 i+ n
var arrfbox = new array();  {& v% W+ ]( a8 B& c. {' m
var arrtbox = new array();9 k5 l3 L2 G6 N0 v& D+ y
var arrlookup = new array();
* P4 y& @2 Q: O; v2 tvar i;
/ P% X6 |1 F+ mfor (i = 0; i < tbox.options.length; i++) {
2 t; K4 m8 y% E/ H, V& g2 Z+ xarrlookup[tbox.options.text] = tbox.options.value;
* o9 ~; f: W; B- M- J# garrtbox = tbox.options.text;& m8 U2 h7 N$ G: Y7 F. c: a. L
}- o  p3 L2 }4 Z% T0 w% s
var flength = 0;1 X2 f0 ]- w& `; c* A3 y  _9 W
var tlength = arrtbox.length;3 q* E& j, i5 q- Z
for(i = 0; i < fbox.options.length; i++) {& T; X( b# a! S; [, ]" g
arrlookup[fbox.options.text] = fbox.options.value;% J3 P( j! m3 [. e3 T& O. q
if (fbox.options.selected && fbox.options.value != "") {
6 p3 W$ W5 H5 Yarrtbox[tlength] = fbox.options.text;5 U% o1 H/ @: {" n7 \; N, S
tlength++;" g5 O, V+ v: O3 i6 z
}2 [! ?: i  \5 w+ j
else {$ ?4 ]+ c5 Z' k( V: p9 _
arrfbox[flength] = fbox.options.text;
8 I; M8 t, J# m; |" B' q$ Y4 x% Iflength++;
' v; n8 t  O' ~3 n6 E. r, ^- U }
" T5 Y+ _, Z+ @, w1 Y6 [, F}! K# c. q2 d  r) _: w" A" h% D8 r
arrfbox.sort();1 W, d% g' W9 @5 K9 [9 R2 |$ W
arrtbox.sort();
4 N, X# J( r1 a+ r8 r# i5 h
$ q( D' u5 _. j% rfbox.length = 0;
: @: ]; \5 W) Q1 @, Stbox.length = 0;9 B  [' e# U# F7 A4 v
var c;
8 C4 a: W( n  A" _for(c = 0; c < arrfbox.length; c++) {
+ V+ S3 K* s; i: U& d( m- {& T$ n* pvar no = new option();
& z  W% ]1 }# k$ L( c# h' ino.value = arrlookup[arrfbox[c]];
" p1 p8 C/ \$ V4 w& }2 b+ N: ono.text = arrfbox[c];$ g, W! v* O* C" q0 ~7 A* T
fbox[c] = no;' {: X( }( q# ]2 S) ]- T
}
+ h3 O$ H2 y0 n, \' Mfor(c = 0; c < arrtbox.length; c++) {
9 S- q& I( k, z% U5 u4 r; vvar no = new option();( w0 p5 W7 ~/ S+ M, K( r
no.value = arrlookup[arrtbox[c]];
, ^; ]! J, e, Wno.text = arrtbox[c];8 z: B( D4 u- b. ?/ U
tbox[c] = no;1 _& w: a2 a+ f" N! V3 r
}3 Z% {: b, ?; V" Y/ O
}' |/ g. k3 P. ]0 x1 D
</script>8 w5 V# V: s7 P$ X2 V  u
</body>
" q/ I3 m7 |4 ~

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

返回列表

jsp+javascript打造级连菜单

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

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