jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"
%>
<style>* N- L+ I, R* B, p
.f9{ font-size:9pt; }/ Q# K$ i8 Y, b+ J! k
.bgc{ background-color:#aecaf9; color: #0033ff }; T7 U. V9 ?$ `& [6 ^
.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;, G+ X& R# g* ~1 i5 R' D3 o
  border-left: solid 1px #aecaf9;; H' E- P% w; a
  border-right: solid 1px #5679bd;
  padding:1px;
  margin:0px;}9 h1 o3 J) K* \% z$ @  v* q
</style>( ]# U5 a1 I$ [. i" s0 C
<script language="javascript">

" N2 }4 R( {7 N' ^. S; f+ I</script>" _( Q/ z; E9 t+ }  G
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
/ }+ u1 C+ M; M) @- Q4 w3 `/ @<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
, p) G: O6 d7 L. u( E<%
! G  A: J8 X1 p; ~9 \  cdatasource ds=new cdatasource();  //数据联结bean实例
: e) L: }& Y9 ?  java.sql.connection conn=ds.getconnection();
: |) y# I; T5 I3 O# v+ G( |  java.sql.statement stmt=null;9 m3 b7 l& \. s: L1 R8 d
  java.sql.resultset rs=null;( V9 o" Q4 M! ]0 O, g& e
  cdatacheck dc=new cdatacheck();( J+ X7 T7 k9 g9 ]" ^# d" n7 o% ~
%>3 K. {! k4 R; W7 m/ H. V; B
<%
  P+ P: I8 X! J% |0 ystring 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";
; E0 _5 N  z" Y8 R& \( [stmt=conn.createstatement();
$ x* {- Z- v, }rs=stmt.executequery(sqlu);' C2 S, k# e: O
%>3 w; P1 t' B+ T* a7 r6 k
<script language='javascript'>
; }6 M/ U$ g5 N6 a' ^& B0 aarr = new array();% l6 i! S; g' X2 q7 v/ w/ q. o+ x
<%  int temp=0;
( }4 t* }4 F( a% X# z5 swhile(rs.next())
: Y2 @/ n+ P' X. d* R& @/ D{
, G3 t6 o  Y+ n, b9 ^. g/ \%>% X6 k5 Z/ J+ T3 K# _
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");( ?$ W! Z3 O- U/ Y* b) {( ^" T+ L! C
<%
0 I" s* X1 n5 ptemp = temp + 1;
; I. N3 l% o5 c& V6 N, o}5 I. ^, g7 f, {5 Y5 s
%>$ o' }  ]% e* j- U+ E; H3 V
temp=<%=temp%>;
1 I  [" ^5 ?0 B& \- D3 Hfunction changelocation(id){
6 A. y3 a) f" a+ sdocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
7 P8 @$ `, G4 q5 D* t8 tvar i = 0;
8 I9 b, [+ G4 K: Y/ odocument.combo_box.city.options[0]=new option('-------',''); / S( [' H. s9 E3 t
for(i=0;i<temp;i++){ 0 q  D+ j& d  H- u0 @
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] % ]) P" H( O- N7 P. f4 ]# J
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); + U5 @3 q2 Q7 M: r, C: [
} . x2 }+ h% h' l$ C
}
3 |! w: U3 {1 c$ w$ @- j& F! C9 o} . h" a3 ]2 G( w/ t) y
</script>! J4 ~4 T- `& ]6 v  K1 @3 A
5 p) n$ ?( K$ E: ]% }+ s7 l
<form name="combo_box">6 k. Y/ u  l6 I
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
, o* i4 V" D5 E. t' t' [/ x7 l0 S  <tr height="24">! W0 Y7 x- Z7 O: Z# U
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>3 |/ @: c3 b* g( t9 W# x! K# V
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
) u# w( ~3 t2 u5 [9 H6 o: ~ <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
( `6 o% `# M% u8 h1 i& B+ A( ] <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>. H  n! R* j" c9 \7 n9 j+ ]: H1 Y
  </tr>' _# {7 i7 h9 S; f, ^7 o
  <tr> / i2 c/ _7 i- l
<td>1 q) v  c8 k+ u! J
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
* p0 {0 U- t" e  <option value="0">请选择部门 ---></option>* M* K  _& h) `: k# D% p6 O
<%
: W2 W* V9 s' T7 |. f string sqld="select * from tdept";2 {- F9 F1 t" H2 \+ V
stmt=conn.createstatement();
& N) G$ l8 U8 M; b: g3 J5 w2 k- @: krs=stmt.executequery(sqld);
: c! e, Q8 z/ G' h+ I- |. iwhile(rs.next())- G4 l9 @0 l6 H' j# N
{
* g# |) t1 q+ s( }%>
$ t* w) A% ]  H/ \  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
0 X: b5 e1 f( @<%4 }2 k& T$ q3 P
}3 {' E, v: L8 m- n- R
%>
0 {8 a2 n: Z) ]8 [* E' N  </select>2 @% k7 O# G4 A2 f) s
</td>
9 {! F- D9 w, O1 _& G3 k <td>
+ E- d2 k/ ?6 b  N8 M# T- O  <select multiple id=city style="width:150;height:200" class="bgc">3 y5 \4 e$ x$ D, L  F: {
  </select>8 {; W8 I1 C3 w% _
</td>/ V# d7 a  S( Q) _( G! e: Q
<td nowrap align="center" class="bgc">
$ }  k9 K0 q* @2 N, L  <input type="button"  value="<<" class="buttons">
& T, j2 Z7 G5 ?9 }+ j3 }  <input type="button"  value=">>" class="buttons">/ ~* M2 n- I$ s7 ]( w  K7 a8 d
</td>% [  f" y9 k" I
<td>
" j8 ^5 C# @& j% h3 W  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">; H6 o% `3 W9 k3 R/ x0 D$ t( Z) L
  </select>% C1 h# R) l  h6 \, n
</td>2 N3 K& s# L( @, k1 ~
  </tr>/ l: s- g0 ^; I  e* E
<tr class="bgc">
, @3 f, s2 d( ^! s0 `5 I7 j: L <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td># I) Q8 ^0 f/ V
  </tr>9 @/ a/ {- r! P
</table>9 g/ W' H/ m' L- K. E
</form>9 e$ s" R9 z2 |" u5 m7 I! K
<script language="javascript">8 C$ a, d1 t" K1 P0 I3 X# i4 ]
//人名移动
1 K9 W: w9 g# Tfunction move(fbox, tbox) {
4 y  |' F/ h$ T% Yvar arrfbox = new array();
/ t/ w* t1 \$ E3 f8 X! Rvar arrtbox = new array();
6 K" l% p2 Z( J" E9 svar arrlookup = new array();
) d* f" N: e; Y6 _/ D1 Z" Rvar i;
8 ^' u6 P) p( [4 D' tfor (i = 0; i < tbox.options.length; i++) {+ k; w' d( S3 W  `3 ^7 @3 [: g
arrlookup[tbox.options.text] = tbox.options.value;2 @" ]; M! K8 p, _. T: l
arrtbox = tbox.options.text;% J2 f3 Y% l8 W, s7 O1 n4 K
}; ]. c4 ?0 a) m0 n  Z! Z
var flength = 0;* E. T3 \0 W: _/ _0 x+ U" e  r
var tlength = arrtbox.length;
/ @- q$ U" [! Y0 @) \; Ifor(i = 0; i < fbox.options.length; i++) {$ L% u0 V5 _, }) m! R6 c; D
arrlookup[fbox.options.text] = fbox.options.value;
$ R( ^4 W* Z3 z9 gif (fbox.options.selected && fbox.options.value != "") {. J8 C" _: U7 b' W# @4 I
arrtbox[tlength] = fbox.options.text;& {% E) W; Y+ o) P
tlength++;- V$ r6 t) ]# a
}
* P4 e! f1 \9 J: D$ e3 }else {
; g9 U& ~0 c! u  N: carrfbox[flength] = fbox.options.text;
0 O8 R0 R! K' `flength++;
  ]  _% y- l6 e0 }' f& m5 w$ p+ Q }
7 Q/ g) m  S/ p0 c}! H: e6 L0 L# {8 o  s
arrfbox.sort();
6 e' @' M6 Z0 n% larrtbox.sort();
3 R" {: D7 D* N4 a
6 W7 Q/ p& X& y% S" jfbox.length = 0;
# Y& A5 A  C2 t# H7 [7 jtbox.length = 0;9 E& [$ B! v) w
var c;
- m7 d4 G# H6 M% E/ P4 O- l: Rfor(c = 0; c < arrfbox.length; c++) {  A2 u" Y1 G5 L6 j; d& U
var no = new option();. X% w* T. |) {. m% Z
no.value = arrlookup[arrfbox[c]];! ]% ]1 J! s- c3 `& Y* n
no.text = arrfbox[c];  A$ G6 `/ `) L) D
fbox[c] = no;* H* s4 @3 H( h/ u8 T- I
}6 W6 w% D% x4 y
for(c = 0; c < arrtbox.length; c++) {3 h) p/ A1 p  ?
var no = new option();2 a$ S4 q( o: u( w  L
no.value = arrlookup[arrtbox[c]];
7 D6 p% O8 l- `( O8 d+ z+ ~6 [1 Yno.text = arrtbox[c];
6 c0 L9 o' f' ?# B1 E5 U3 I+ z8 Jtbox[c] = no;! n+ Z: ]. l0 q- @; K3 H1 R
}
/ a" Z" o  C: u$ c}
. m# O8 x$ W% n$ Q/ w) p</script>5 }" @+ W. t& L' ^
</body># c' C; P; F; v; ?6 F' R

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

返回列表

jsp+javascript打造级连菜单

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

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