jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"3 I* F/ z( O0 _" ]3 }, v+ h* y
      c pageencoding="gb2312"6 P3 B0 k# d+ A' h- y
%>* H4 \$ r( L2 n7 w4 H! M
<style>; H& Z: I" z% \. I
.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;
  border-bottom: solid 1px #4e7dc1;: s0 `  J. _; }) F5 E) p
  border-left: solid 1px #aecaf9;0 z9 U! k2 G; J; ]. C5 H9 l, ]
  border-right: solid 1px #5679bd;9 M! l+ G! X( u0 {  U! W5 Q
  padding:1px;
  margin:0px;}! o. _) [0 g9 F6 t* X
</style>; E$ M* @3 ]8 b- V+ O# ~* ]$ D0 i
<script language="javascript">

0 o- s1 P" n. V- g</script>$ u: B. z, Y+ L. N+ V7 K. ^7 D
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">2 e( ~4 b$ {7 W: p# U* r
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />- L( y2 p" l; W
<%& \- @4 _& n4 p" L& [7 L5 F
  cdatasource ds=new cdatasource();  //数据联结bean实例7 f3 B/ L. t. O) ^; R6 {/ I4 n
  java.sql.connection conn=ds.getconnection();
  d* K6 S4 ]' [& M0 W3 j  java.sql.statement stmt=null;
4 d3 a  n7 y$ ^$ x: t  java.sql.resultset rs=null;! K" W9 @& E1 N$ G. S1 n# w0 `
  cdatacheck dc=new cdatacheck();
, u- T5 V* b! v  n5 y%>, m/ d' b9 G; g" n
<%
8 C  {& z3 I5 jstring 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";
# m  b: B1 |9 q! T. B. ]1 astmt=conn.createstatement();) {/ ?2 ~* a2 h; f7 E6 u
rs=stmt.executequery(sqlu);  o0 B& \4 |  Z' ?" O
%>( w1 u1 i6 W9 J8 f8 \
<script language='javascript'>1 @1 c( @# z" F
arr = new array();8 a! p5 P' P6 G: Q
<%  int temp=0;3 a9 x5 N9 S& b/ h
while(rs.next())- y+ z. |. b- d- T% R* ^
{
. b9 {% ?) h+ f# W: o! G%>. \1 l0 |+ l. c" C% w! L0 o# B7 m
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
9 E  B0 Q' r# O" t0 ?3 v8 t<%9 O* |1 H$ j/ X2 _" Z
temp = temp + 1;
6 v$ [! G5 h/ }" C}
7 F+ v: `: D3 d4 m/ Q%>
4 ~( f! c2 M2 P& ?3 _+ J) p2 Ktemp=<%=temp%>;
3 o* P. A1 Y0 l# b, }% Kfunction changelocation(id){
) Q0 B: q  O$ D1 [# O, |% gdocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 ! ]# u3 L, _5 P7 \( O  T# p' U" \
var i = 0; , J" Y/ W$ a/ s6 w1 z1 l
document.combo_box.city.options[0]=new option('-------',''); 6 `# T. I" ^" A3 H
for(i=0;i<temp;i++){
1 }8 ~6 Y0 B* ?; B/ @/ O/ vif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] & T( W% b% D  r0 q9 Z* s
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); ( l5 `. v: b0 f! y% |: I; U
}
2 ?: i9 o' F) w, b0 o} 2 q1 N; n; C2 \# u( U
}
. v$ G  o3 j. w* ]# D  {! }( g( K</script>5 @$ {8 u6 W% J3 c% `
( A/ o4 U4 M) J: j5 `$ e
<form name="combo_box">
, y6 K, }+ o% q, M: T: P<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
! x1 C1 ^& h6 k8 O* e  <tr height="24">7 ?: O/ {7 c* r: A( X
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>  M% F: G( R$ s' x# U. a, j6 y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>2 @* L, a0 v- O0 @- |
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>% w6 H) m: ~! I8 r7 |
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>- i* p* z+ l: d
  </tr>
; G" @* }% O% G2 J. b" M  <tr>
7 A. z2 t) @# I8 C  B/ `+ Q  J <td>) @9 B+ U4 S, m! e" U; j
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
5 c7 d8 H* T( I& R) B. \  <option value="0">请选择部门 ---></option>; H3 X! ^5 l" t- K* O( h( y( \5 `. Y
<%- S8 K( A7 J3 g( i  F
string sqld="select * from tdept";
! G/ G6 t( p* wstmt=conn.createstatement();0 E% N+ X6 k) \
rs=stmt.executequery(sqld);$ v/ H8 v% @0 c
while(rs.next())
1 e0 Y+ Z/ ?$ s0 \4 [+ D/ z{* k8 z/ e# q7 r$ J! y9 B- ]
%>" e/ V3 ~' m- u0 C
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>1 Q3 o* q7 ^3 g5 ?7 A  v( C0 h
<%5 e% y' V% ~, j! s8 V% W5 m- t1 t
}* {# m# @0 N. J" d. Q
%>
' }, @! d7 e8 x2 p+ p2 g  </select>
! h; @. U$ p* z% v</td>
- O% |: ]+ B4 Z, r- Z+ A6 l <td>
1 t/ w! M# ?& I  _2 }7 R) O  <select multiple id=city style="width:150;height:200" class="bgc">
0 e) p% u+ r+ z" g- I# r  </select>
7 y9 ^& o# F# m</td>! H% B+ S3 b5 H# ]
<td nowrap align="center" class="bgc">
  b9 D, k. d; [$ U0 a2 e/ y  <input type="button"  value="<<" class="buttons">; g# n' g5 J& ]. f6 ^4 x6 p. b
  <input type="button"  value=">>" class="buttons">
$ v5 T, H9 B3 D! N</td>
3 p) A& P1 T# Q2 T7 l( P# l9 H <td>
6 L# m5 s8 A2 K- H* T  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
% z; y. P( g( {, W5 M: P. c) M  </select>
, z2 ?- }0 `5 o</td>& h" `( i! M5 ~/ k+ U& Z9 R
  </tr>
, u: b& @  T* W <tr class="bgc">
0 ], P4 n& m# x% H" X7 u, `8 M4 \ <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>, A5 i/ g) a/ y% v
  </tr>- ]0 h7 @- i6 r8 ^1 p- b0 Y0 z/ O
</table># U: w& s5 _: g9 H9 w7 s& h1 [
</form>( @6 r# T6 P% b4 [, T: h
<script language="javascript">! p; B7 Z1 }$ J7 ~. n: Y1 {5 {
//人名移动
- E% m2 H# D2 j4 R# r4 a0 Vfunction move(fbox, tbox) {
var arrfbox = new array();0 \, |+ N# m% p, L) u' A( P
var arrtbox = new array();1 b% \& K9 _  a& n# R% K8 z
var arrlookup = new array();* Z% e9 ?3 R+ }- t
var i;6 [  T4 W: l* W/ f
for (i = 0; i < tbox.options.length; i++) {; M# [' [( u% K7 P
arrlookup[tbox.options.text] = tbox.options.value;9 U. i( H, n6 g, p- M
arrtbox = tbox.options.text;
; a2 g( b% U5 \  o}
var flength = 0;: p/ B& h4 J3 H# N# N7 J% o
var tlength = arrtbox.length;
. ~* J6 s* Q* A8 `8 M8 x9 lfor(i = 0; i < fbox.options.length; i++) {
1 F$ v+ v; s2 Q8 ~7 yarrlookup[fbox.options.text] = fbox.options.value;$ M% d+ Z5 p' k7 H9 p9 v  J" V0 N2 G% g
if (fbox.options.selected && fbox.options.value != "") {
( z' d7 ?; R. Iarrtbox[tlength] = fbox.options.text;7 t% P3 k; S. ?6 o1 h
tlength++;
$ z# T$ M5 {) P7 W' z" ^}
7 |) P% H/ R: I6 ]# V8 aelse {
: o7 v/ x9 |' J6 Jarrfbox[flength] = fbox.options.text;- U! Y) L+ O) f9 p& u" _
flength++;
: t: i2 l3 M, G/ M& M+ l }* O2 k; Q/ [6 J: v# V# o
}
9 v* a9 m0 s  V0 v( }arrfbox.sort();' U& o( e! f) r8 `" f
arrtbox.sort();' D( v0 Y( ^% ]* q) T# v

9 i$ {. i5 f: t, dfbox.length = 0;" Q* i  G+ E. [
tbox.length = 0;
; O3 w5 }% {) E+ lvar c;; i( H* f" k* H2 v0 e& ~0 O' l
for(c = 0; c < arrfbox.length; c++) {- B9 C% Q0 Y* y; d: M+ x
var no = new option();
* S9 z- U' G  @9 w) J. P) r1 ~5 Cno.value = arrlookup[arrfbox[c]];' \1 h$ u; {& W
no.text = arrfbox[c];% t7 o! ]8 ]+ J8 Q1 b& e- S
fbox[c] = no;4 S) B4 i, f0 [+ w5 F) B
}
$ N  `9 c  M* w8 p0 P/ k: Z* Ufor(c = 0; c < arrtbox.length; c++) {) ^$ ^) b/ v% L
var no = new option();1 F- b7 E9 c3 V  ]# F6 c- A
no.value = arrlookup[arrtbox[c]];* k% n6 e% l% C* [5 r
no.text = arrtbox[c];' b* ^" o  U# v
tbox[c] = no;/ {) }% r0 _6 {6 W, R  l6 y
}
0 t  k% H! T) B% I- M& r4 S' r}+ W( Q9 [! _; f( K/ r
</script>6 z! h% M' o: f6 s3 L9 l
</body>
! A" D* Q) B( B3 H

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

返回列表

jsp+javascript打造级连菜单

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

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