jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"
%>
<style>- q( K& @: D9 E7 b+ H9 @
.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;* `, r+ c6 N5 i% v, k$ k
  border-bottom: solid 1px #4e7dc1;  \* f' k, C. P) R+ ^, S
  border-left: solid 1px #aecaf9;# G/ O- F2 c- l+ n/ z
  border-right: solid 1px #5679bd;% i! G  ~& q8 G; ~3 Z9 F! s
  padding:1px;
  margin:0px;}! [8 z# V+ W& t
</style>; @* t) C% ]6 C: Q
<script language="javascript">
& L! Z. i7 ~- `& |( V
</script>
# U4 M7 {: E( z& R<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
! x: D: l% e7 |, e/ n$ B  t- o<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />3 b  v+ d1 s' f4 b+ n9 P
<%" K0 x& F1 `2 i( v) M/ ]& w: E8 T! \
  cdatasource ds=new cdatasource();  //数据联结bean实例7 j# F& P8 t- i) ?
  java.sql.connection conn=ds.getconnection();: I( v% r$ |* ~# b
  java.sql.statement stmt=null;
# u- N/ k" B$ `: k  java.sql.resultset rs=null;( t1 c4 {2 E3 h# \& J
  cdatacheck dc=new cdatacheck();
! A! ^4 a# t$ e2 C" o%># V+ j/ j5 u  F# e, B
<%
; w) v% I6 P  d; i: X  fstring 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";
; M6 i3 E! a: B9 X3 t4 rstmt=conn.createstatement();
* J* v% I1 Z; o+ F$ b  S* |4 Qrs=stmt.executequery(sqlu);
0 X( ^2 w1 N0 T+ k; m%>+ Q, G* o9 c# c2 [' d+ E
<script language='javascript'>
  B* Y! W- F# ?& O, @2 J+ rarr = new array();
2 b$ J6 Q& c: e0 `<%  int temp=0;- q& s, G4 U" l. k9 e( P! q4 x
while(rs.next())3 a( g  T9 s1 o' A( n% _
{
2 o" T3 T- _- L0 Y: m%>- q' s+ G1 ], {, C: C
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");5 J% Z, r1 M9 n0 h$ J. ~# o9 b. S1 D
<%
7 Y8 q% y9 n6 Z: @. @9 d. v. k+ Ytemp = temp + 1;
4 d5 D- ]/ X' j  [" |8 g* e5 A' N}" a. i% i* @! J
%>
1 {/ j  t$ K% G. itemp=<%=temp%>;4 X+ R7 y5 b- D8 N! H: G' }
function changelocation(id){ ; o# g0 R3 d* o& j% N  m/ Q7 @
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 # U% Q3 u) B2 ^# p( m% _
var i = 0;
2 N# `$ H$ R) W5 A3 J. ?0 fdocument.combo_box.city.options[0]=new option('-------',''); / e' J' `2 c' [, Z
for(i=0;i<temp;i++){
0 ^% Z3 U  O" p. |8 z- yif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] . e' e9 `! R! y7 [9 B# y$ K
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
( k( J3 C# M6 C' [' X8 f( y} % X+ y2 Y# c  P3 g  d
}
}
9 Z# f( F6 V" \) {4 u, A, n4 q</script># r5 Z6 N2 y4 \3 n/ \+ K

0 k/ @( ^- \; N6 |9 ~% p! B<form name="combo_box">
1 P! Q8 d8 i5 ^0 g<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
1 D+ B/ k, D2 g% B; h; F3 F8 t1 o  <tr height="24">& I4 y: r0 {+ ?. Q- g' E' j
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>" q4 A2 p7 U$ N" d
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>" v- U* R  I* ]. {0 o
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>9 H0 I: H% k( r- k+ \+ X  B. A  I
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
6 h- |; j& |& w" B) x$ P  </tr>* i2 b2 }* G6 t! s9 a  l' P
  <tr> # X/ ^2 s* t4 }; q$ B0 b
<td>/ D1 b! c0 B5 \, H3 t, W
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
# Q3 I7 L2 Z( G& \  <option value="0">请选择部门 ---></option>
6 l% n- F' f+ N1 p# t  y. D1 M<%* b& M9 L) q5 n7 k
string sqld="select * from tdept";
1 M# f5 c' _; S: f: W' g& ~2 i* L  ^stmt=conn.createstatement();  e2 a4 O  F7 ~8 W4 P, O
rs=stmt.executequery(sqld);
! F1 T  d- P1 o4 Ywhile(rs.next())
/ w/ t: C' J. P/ k  Q6 Q{% E0 K: j( y/ ]5 d  D  M+ j
%>* x" Q( S2 Q. _1 }, `% g
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
, U/ U. T  Q0 r: [<%
5 b8 {8 Z5 c# |! D' }) q}- G* f! }* [9 P( B6 W
%> " O  r- I0 [. z) g3 @6 m
  </select>
! D" z: D7 `0 d. p% V; k/ w& O" p</td>
4 U, D, e6 v2 H <td>
% A8 X9 T5 C$ B" v  <select multiple id=city style="width:150;height:200" class="bgc">8 j1 z! z$ w. e4 A+ o
  </select>4 V7 U. I" G" I. Q) E2 P# T
</td>2 T& L* J. V, Z, U
<td nowrap align="center" class="bgc">
4 A; d5 n8 @, g  <input type="button"  value="<<" class="buttons">
% x9 _- b  V2 K& p9 R+ H  <input type="button"  value=">>" class="buttons">
9 e, m$ V( V! X$ e' |</td>
, @8 W5 C2 g. }1 m3 K <td>% i" L3 M+ Q& g1 }
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">3 L$ |; A# g7 c9 G. Q' o% M4 J, d
  </select>8 W/ O: s. y7 n) b3 U* \4 W0 D0 b+ x
</td>6 ^( E$ j4 V9 _4 }' b5 j
  </tr>
' L, t' P# R6 w' r% X& J( }* A1 ? <tr class="bgc"> % h4 K2 A3 U; T" @- O0 \7 M4 ~
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>$ @7 N. Y0 O5 x7 q; v" B
  </tr>
' @1 b" g6 S* w8 j8 M5 t# V( D</table>9 L5 u3 A% W& K; E
</form>$ e4 q* P) t$ j- ~& k, F" U
<script language="javascript">
, y) ^: w% m( M4 @/ }. Z//人名移动, u  ^( u: A2 z4 _/ Q
function move(fbox, tbox) {
( J& p' j" b9 vvar arrfbox = new array();
; I! q9 x" Y2 S/ A% Bvar arrtbox = new array();
3 N9 l5 A' I0 l9 L8 N- a9 U3 y$ s1 Evar arrlookup = new array();
& D$ X, S# o; Q( svar i;; G" K6 g! D# O9 J6 ?( g
for (i = 0; i < tbox.options.length; i++) {
$ q. n- x; o$ f# W+ B. }( v; }arrlookup[tbox.options.text] = tbox.options.value;, K. Q, F$ z( s  f& W
arrtbox = tbox.options.text;
/ N0 Y3 T) T' F* O}
, m2 c0 U1 z1 q0 d1 dvar flength = 0;
# O, X0 s& x( J4 T5 Tvar tlength = arrtbox.length;: x# ]8 m* X; o8 N! j
for(i = 0; i < fbox.options.length; i++) {/ d) t0 V; E" P; w2 T
arrlookup[fbox.options.text] = fbox.options.value;! U' c7 |0 X, \( j7 o
if (fbox.options.selected && fbox.options.value != "") {0 A5 D! h$ Z# }
arrtbox[tlength] = fbox.options.text;
( b4 @0 n; d% \( f: U8 w" dtlength++;
! v4 W9 k" L' f( T$ e$ c+ F}
+ m5 t3 X1 ?& ~% i1 Selse {
+ }. Q; @" _$ p8 @8 o+ D! Qarrfbox[flength] = fbox.options.text;: ?0 U- R5 F# B9 _- @2 w
flength++;
9 n: V1 J% T; O0 {; P5 {3 P# a3 p }
  J: Z2 P6 }7 [% c( Z! _6 k2 E; r+ I}7 o! h6 I3 ^% W4 |4 b: {
arrfbox.sort();
/ V8 E* H$ }& V  Y+ n( oarrtbox.sort();+ J# B0 s0 b, d

9 H6 `: B! d- i- Y! G3 V" O, dfbox.length = 0;& m' k; l# H* R4 X  x
tbox.length = 0;
4 x/ c5 S" e- t7 R# D3 Ivar c;% i/ _0 w- c, K# O" H
for(c = 0; c < arrfbox.length; c++) {" j0 n7 c+ B3 Z6 U
var no = new option();
; g. j+ c! N. w6 L) tno.value = arrlookup[arrfbox[c]];( B, H& u$ }# \* _: g7 ^  e2 G
no.text = arrfbox[c];  {! F: `- B& r; o' O2 U: J# \1 |
fbox[c] = no;3 r# v# o  B) g- ^/ j; D% K
}# K# ]) K/ A* _& o7 Y3 Y) r
for(c = 0; c < arrtbox.length; c++) {2 s' D4 X5 v  L
var no = new option();
& ]: w! p4 o; }+ `no.value = arrlookup[arrtbox[c]];
5 B- `+ t) z* t& i0 D. J% f0 bno.text = arrtbox[c];
* F8 d2 ~* m: K6 ftbox[c] = no;
8 D8 o) |# C6 d& \ }- p5 x5 W7 \0 |5 f) m. I# {
}4 L# W8 }; H! ]' v2 O6 D
</script>% Q& _& U2 f. j- B  j
</body>9 s) D( z# L, Q* K

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

返回列表

jsp+javascript打造级连菜单

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

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