jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"# o5 H4 V+ l5 `7 p
%>! U0 b5 T4 _, p$ z- \0 `
<style>% Y+ y# i" _+ v8 u, G; r- D& Y
.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;4 E$ C: Y. y- g- w( X: _; \+ q
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;/ L; ]" |0 `; M! p2 K$ n3 ]# B) [
  padding:1px;
  margin:0px;}
</style>
<script language="javascript">8 `  G4 W/ _) ]9 ]

+ o9 V9 b8 [* ^' z. s</script>4 {  L2 B! @- N$ H6 v. V+ ?  W( X
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">. Y" Z/ e9 U+ M- E# c1 T4 Y
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />: \4 N: s7 Y5 J  ^. m+ N! O
<%. ]3 I1 l* n  N
  cdatasource ds=new cdatasource();  //数据联结bean实例& I; i4 L5 Q; A
  java.sql.connection conn=ds.getconnection();6 [+ v& V9 E( @- [) I1 O9 ~
  java.sql.statement stmt=null;
; @. F; u2 w" V7 V% J  java.sql.resultset rs=null;
8 F0 C7 h0 Y3 O( P* h7 y4 z# l  cdatacheck dc=new cdatacheck();
0 b! ?' E0 E! A( N" y%>
2 d; |6 ?, _% [7 @8 k& m- b<%6 z3 w: _( ?$ z, Y, C
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";6 o9 G: n4 m8 M+ f
stmt=conn.createstatement();% q, A- g+ G% D
rs=stmt.executequery(sqlu);
( x0 |. ~# e: y0 [* F  H%>
* [- \0 G% G; O  x4 p, n$ Y<script language='javascript'>
9 ^/ H4 u# H. L( n8 Aarr = new array();% X2 J% ^6 L. O8 ]9 G
<%  int temp=0;. ^. Q( T' H1 X* V
while(rs.next())
, j" k: r8 ?: g5 |{1 F9 |( ^4 y! B
%>! k4 e+ U2 T0 j1 X) @
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
0 \. V2 M* i0 l, {. J' b( h& V<%
2 ^3 m  Q: k2 f; k/ ftemp = temp + 1;( s7 p! S4 O- e
}4 E$ ?( v; @1 Q- N5 V8 }
%>
; E1 x+ T8 O/ ]( \; |1 ?temp=<%=temp%>;4 H' E/ N% W4 t+ l" a# R; E
function changelocation(id){ - f& C  Q0 h: ~
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 6 G( X/ q( o  c! {; W& R
var i = 0;
, P( y7 |* _! z- o9 T" ^) c( Idocument.combo_box.city.options[0]=new option('-------',''); ; h9 v2 p+ q9 e# @* ?
for(i=0;i<temp;i++){
, R+ P7 a+ R* w2 k8 B1 Z! hif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
; Q0 E3 o4 p2 X3 M. adocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); 2 p7 y* P* O6 P1 N( A
}
7 L( h3 b1 |/ ?9 K5 R3 j} $ v$ r6 q/ a# R. m. m
}
, M8 ]) A1 L" B  @: p2 K9 F. Y</script>
( C5 s% |: W- n% y3 Q
1 P& y/ R/ I' V) m4 n<form name="combo_box">
: o1 A: n3 Q3 J! r8 E6 [<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
2 G  k/ I) }) X: {  @  <tr height="24">/ _* q& p8 z. f8 U7 X; B. l/ v
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
( N( `8 U% w1 v6 ^2 F <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>( Z5 y4 c0 ^  m( Q
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>; o; r+ T. J  t& z2 X" \
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>; B/ O3 Z+ N) ~# E3 c! _
  </tr>* }/ F  m/ U% X
  <tr> 0 J4 _6 Z. Y& R! A
<td>
# o' k! _- s' q5 T0 I  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
8 @/ C, h8 h) E" b4 a6 @  <option value="0">请选择部门 ---></option>
4 i. Q! s. [7 I4 L$ ]3 |<%
# j' N- `- K$ A- B1 ^/ w string sqld="select * from tdept";! J( `! O; m# F/ m; b' ]- Z+ M
stmt=conn.createstatement();/ N( o0 t4 d0 z( b0 \
rs=stmt.executequery(sqld);: ^8 s- n: M) @! S
while(rs.next())
1 Y3 L! {; g" d, ^) ~3 _{
; O6 `% m3 G" s%>/ u9 V2 s" X. \3 c5 O
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
% c# R7 H" I7 M  t8 @: w<%) ?  f3 o' i1 m
}2 l2 K* A" |1 J' o4 Q) ~
%>   v5 L- T; T! a( V; I4 Q
  </select>" F: O% u- D3 q# t, v( j  ^
</td>3 U$ B. v$ j& ?
<td>7 F) Y3 m" n# L) g1 f
  <select multiple id=city style="width:150;height:200" class="bgc">
; }, H4 E, z, F, x& h! a  </select>
. y8 S: e. C0 E+ H* Y" P</td>$ f( a; h4 J0 `# _6 x( X
<td nowrap align="center" class="bgc">! k, G) j. n( `* K% O
  <input type="button"  value="<<" class="buttons">
/ G: \, F8 x! d$ o5 ^3 G  <input type="button"  value=">>" class="buttons">
9 d" a# F. p; s- O! ]8 c. n$ L</td>
  F% c, U: i- V* ?% S <td>4 ]# h" |3 T) m6 {" c& s3 M
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">7 w: ^+ ?2 Y3 k( z0 t8 O3 ?6 E
  </select>. w; ^0 i, ]$ ]  U
</td>$ y5 K, r: G  g
  </tr>
! ?# B) P, b1 C8 J <tr class="bgc"> . p+ @9 ?) H' I! D4 Q; b. }
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td># i/ ?, }( u6 i
  </tr>. }- F8 n! K4 \6 P; m
</table>9 Z) u* c; a7 [: o$ J+ P
</form>
: l. r) v8 E" `" A<script language="javascript">
4 t2 A6 D9 Q5 i//人名移动1 O8 Q% D3 x2 t+ \: Z# g
function move(fbox, tbox) {# Y/ Q3 Y) [/ y
var arrfbox = new array();9 {9 J1 v+ E$ p( n) N( ]- D- u
var arrtbox = new array();0 F' z4 b9 b+ {+ ]1 }: I
var arrlookup = new array();  x9 R8 A% i& y
var i;
  W* H) t  L" P8 v7 ?for (i = 0; i < tbox.options.length; i++) {9 K2 v' }) D5 w% z& Y
arrlookup[tbox.options.text] = tbox.options.value;
( |! a+ ~" }/ k+ ]& b: Sarrtbox = tbox.options.text;* Y' {. R( f- h  k7 w" L
}* S8 N. p! L! R- N5 z
var flength = 0;# z  o1 e5 [3 ~. r: K1 D! ~0 S; z
var tlength = arrtbox.length;
  B# M- b1 E' nfor(i = 0; i < fbox.options.length; i++) {
- r0 i/ N, b5 M  ]( `6 Sarrlookup[fbox.options.text] = fbox.options.value;; m1 j! F+ u8 e4 L% _7 j+ W) j
if (fbox.options.selected && fbox.options.value != "") {. D/ d; F+ Y9 f+ a) W0 k; Z
arrtbox[tlength] = fbox.options.text;' O% N4 ]$ Z$ o* n  ?4 W
tlength++;1 b: G, Y0 m. K6 r3 t6 X4 ~
}3 v$ e1 R' W6 ?) W6 e
else {
6 p# z& r4 D/ j9 j) ~% E2 varrfbox[flength] = fbox.options.text;
  S' N( V7 k$ z, i0 r  R0 O# xflength++;. y  e% \- m( v: T# ]3 H9 g. w2 F
}
  N- B0 D; |- ]}
) c' k- H/ W' W$ n5 h# Q* rarrfbox.sort();5 n0 x' z& D6 w. r) O! R9 h
arrtbox.sort();( o- a* f, i: I7 W. Q' ^! n
# Y( J3 @* l( \, G
fbox.length = 0;2 F2 w' A6 g$ j+ t
tbox.length = 0;
/ B; z' @+ ^7 c+ K) g$ ^- Lvar c;9 |) P% P& M  _6 Y  ?- ^
for(c = 0; c < arrfbox.length; c++) {
8 Y; I. d" H& r5 G, C* ?3 d. uvar no = new option();* r1 ?7 p) Y$ n2 `- i
no.value = arrlookup[arrfbox[c]];3 b; N; [1 f( U! |6 D+ J+ Y3 S
no.text = arrfbox[c];4 l' M+ G" Z3 D/ _; [6 P5 S( k
fbox[c] = no;
9 C, A! H$ h  m0 r; [# P}8 n! W: w) L' l3 s5 f" O! s& D
for(c = 0; c < arrtbox.length; c++) {
" S) G) \! k) H4 ~$ ]var no = new option();
# J1 w, `( ^2 a5 N4 `  O+ D. f% mno.value = arrlookup[arrtbox[c]];& N- {; A  e- y  L% z2 s
no.text = arrtbox[c];
; w  X: K. o6 ctbox[c] = no;
& U2 i. T! b5 ^ }
- X9 }; J1 J, j+ F, t8 }/ B% M}' V" K  N8 Y5 L9 E
</script>
/ n; @* ^% q% m0 X! q* O</body>
+ ]! R3 O+ j5 d0 {

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

返回列表

jsp+javascript打造级连菜单

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

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