Board logo

标题: jsp+javascript打造级连菜单 [打印本页]

作者: admin    时间: 2007-12-5 17:43     标题: jsp+javascript打造级连菜单

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"* Q, K8 o3 P: Z# l5 l4 f2 B
         c pageencoding="gb2312"
# ]' ^; U7 P8 l0 F%>
. N6 u7 g, p" V% E" Y<style>5 r( j4 p/ Y9 {8 T! K3 G
.f9{ font-size:9pt; }  M9 z0 T2 [& v- F% l
.bgc{ background-color:#aecaf9; color: #0033ff }  u' Y# r' U8 h% w6 _
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
2 h$ m9 w  |' F3 h) ~7 }  border-bottom: solid 1px #4e7dc1;- l' i# Y! K! i1 K
  border-left: solid 1px #aecaf9;
- O8 A- P4 Z7 A' i+ P9 l  border-right: solid 1px #5679bd;
# e  m# D) j  @8 ?0 y% {1 K  padding:1px;0 |- ^" A* [* D6 H- d! {
  margin:0px;}
4 ~; j/ Y+ ]2 B" J& N" @6 K</style>( Z( y. V0 ?; p$ h
<script language="javascript">
. d$ [$ q: P0 G3 W<!--9 l, i- t- N) _/ X: W
function rv()
( s! b( w! K1 B4 A; v{
: j$ W  p7 Y& `* ~! [+ ^2 q  var val="";  f/ D- T. L8 e/ Z
  for(i=0;i<combo_box.list2.length;i++){  W9 }) o0 s, Z/ u
   val+=","+combo_box.list2.value;
8 ~3 Q# U1 u% |3 E3 {7 B  }
# \* O: D1 R1 ?3 m' c0 E  if(val.charat(0)==","){
/ z% }: u* E1 g! h5 E3 c   val=val.substr(1,val.length);5 r3 n3 H1 F7 b
  }; ]" J( M+ @9 A& c7 S3 p" d
  opener.form1.frecname.value=val;  ^% G$ g2 g& E  z- C/ Y
  self.close();
8 d( _. Z# [5 g, C7 @+ ~}
0 h  k0 p! A8 a" _% R//-->
' Q# r, ?2 m- F</script>
* J0 q+ G2 e! l: x# E& |2 O* b<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
% k9 l) _, ^1 `, F. T0 N  b<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
4 h2 R  g8 v5 \/ r, L- E. M, F<%6 ^! F/ M6 v0 c. P. n+ E# g
  cdatasource ds=new cdatasource();  //数据联结bean实例' @7 a  `! f; m. i: w1 D( l
  java.sql.connection conn=ds.getconnection();
2 Q0 A( S8 y5 B' N  java.sql.statement stmt=null;; {( p) d7 `% d: f% O0 e7 |4 b
  java.sql.resultset rs=null;
; E0 ^- r# e/ h7 Z6 g" V7 P6 A* s  cdatacheck dc=new cdatacheck();
; d  B  Q: |% s5 @+ e% e. Z# ?%>
$ y: N* l" U* ?2 s* f" \$ ]6 c<%
) @! i3 q- m1 L- t  r* ]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";
& E5 z9 l9 x% A7 C* c" H. }stmt=conn.createstatement();
7 v2 }8 l# Q1 U0 K$ y5 v3 prs=stmt.executequery(sqlu);) D! d/ Z) D) a# I2 g6 g/ P' t
%>
9 N$ o% v9 @$ ~# h: I' A<script language='javascript'>
5 ~  k6 [) F; e3 aarr = new array();
$ d, ^: R- r# D7 X! U<%  int temp=0;
3 {# H: y9 X0 ~3 ~while(rs.next())
9 c0 ^, X4 O& W; U+ I' x{
0 p9 z- C# c5 n! [- D% g%>
. a/ }) P) y# x% |  z5 b4 N$ e' varr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");8 b* m6 F. w8 ~: f3 O
<%4 E7 T+ q; q# g, ]7 B
temp = temp + 1;9 t' g) l  r' _* P
}0 t0 |3 d% ~, ~; H# ^
%>, \. |5 Y; _7 c. n+ ?
temp=<%=temp%>;
' f# q: K& D. M6 ffunction changelocation(id){ , h* g9 }- |- x
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 # y* w" X; Y7 [. B
var i = 0; 0 V  W5 y  {" l' U7 ?
document.combo_box.city.options[0]=new option('-------',''); # r5 W$ q: O0 o* z
for(i=0;i<temp;i++){ 5 r+ P1 D! g7 C/ h, a$ _2 d
if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] . @5 h, `6 E9 x: E
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
& F) v9 h: O! J* e. E}
4 L* B1 g. v* t+ R}
! F0 A- s; H5 M6 V! R}
/ F' C* ^( L* N5 S5 Z$ Q3 Z</script>: ^% y' v. e8 o6 c' p, ^
5 D# o+ Z/ C0 Q8 p
<form name="combo_box">
% }* z% U# I8 u<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">6 S+ u0 [; }, R% M/ j! T  X
  <tr height="24">
3 ]1 h/ m' {$ p$ [! c1 Q% z    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
+ a6 n. s/ W  g4 r3 o$ r    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>3 X4 q/ T- W; g5 L2 C) c
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>: [9 w; p, y' m
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
5 ^9 s4 n+ W* o0 T/ e2 h" I4 h( k( i  </tr>% e+ G" e: k; m  o
  <tr> 4 Z+ g/ A2 W0 r# N. M
    <td>
7 o- j+ T9 ~1 @  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
  F! @; A0 _5 @$ E$ `: ^, z# [. h  <option value="0">请选择部门 ---></option>* f6 w$ Q7 V( G9 x, D
<%
) n' M! _0 Q( G% E  C8 }    string sqld="select * from tdept";+ g; {; V$ [0 t  b
stmt=conn.createstatement();+ u# J) d8 P, ]# P8 G
rs=stmt.executequery(sqld);8 m. w# b7 k# z  ~! R
while(rs.next())& C2 q0 d  o' l
{$ d9 j  G! Q4 o" @0 {+ T$ @' Q1 Q% ]
%>
4 F0 Y" H- S) r  v  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>; H2 Z6 \# f9 J# Z; {9 q
<%5 r; A% S7 G5 O2 X3 z
}8 R* y2 D- N1 P9 Q6 H, \- ~: e/ B
%>
. m  A+ T/ |6 q# q, |5 J3 B( s  </select>
2 G( {4 P+ J8 `& z9 M1 R</td>$ Z0 f) z. U/ t( [0 K' v0 ^9 Q2 `+ ?( \
    <td>
" E; W! A. ~: Q0 d3 O+ ?  <select multiple id=city style="width:150;height:200" class="bgc">
; i! L/ i! _# K. b. g  </select>( O- t, M: J1 y8 l' p4 B' V; m
</td>0 Z3 x  k. [) ^3 @  K
    <td nowrap align="center" class="bgc">
, f5 I0 @" e0 n  <input type="button"  value="<<" class="buttons">1 z7 U& ~& m3 g. M; n) n& d) u
  <input type="button"  value=">>" class="buttons">
/ R2 N4 D' w& S+ e</td>' B( y0 `3 y+ M9 r: x. i
    <td>
" f/ F; X" C3 ^: j$ Z  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">& W3 b/ ^( R- e8 e# g
  </select>0 Z8 K6 N5 Q$ R# f  e
</td>
1 n; n: X% Z$ l  </tr>  @9 }9 U$ x# a) [1 y- W5 ?
    <tr class="bgc">
9 X# C  J0 V7 ]0 X    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>: X$ W! R% B$ t, i6 j! Y
  </tr>8 n% r/ T( G- J4 y! \- }- A! n
</table>
+ N! }5 i) m3 y+ K7 I5 ]  [</form>
0 Z4 S$ Z, @  \# o% _( `. N<script language="javascript">
1 n  V5 L& E) e" I! y% L, w//人名移动  a8 e; V) l3 W
function move(fbox, tbox) {
6 e  U- t6 |% Y6 M7 x% U% w% Rvar arrfbox = new array();0 i: {+ r* j/ d$ d% h" e
var arrtbox = new array();
+ W% D% J' V* @8 N+ kvar arrlookup = new array();
4 i: ^" l) t* M. N% g% C$ g8 @var i;
! R: {) q- I: {% Z1 {0 [) bfor (i = 0; i < tbox.options.length; i++) {6 Q' |) Y. C2 y3 ]2 w' r
arrlookup[tbox.options.text] = tbox.options.value;0 |& v4 O; X0 x) c( y" {0 Z; H* g
arrtbox = tbox.options.text;
7 Y6 l0 b% V4 C# j}  {% x# X3 q0 ]. x# e
var flength = 0;7 m$ b' h1 [  A  U4 T, S: [3 T
var tlength = arrtbox.length;
  p2 s8 e7 ^  t4 c  f. Q! B5 H) sfor(i = 0; i < fbox.options.length; i++) {
  @, T2 x' o& }( u8 x! l3 `7 Xarrlookup[fbox.options.text] = fbox.options.value;
7 Z7 L: B/ }7 F# yif (fbox.options.selected && fbox.options.value != "") {& Q  V4 t2 @+ M" X% `: K; o
arrtbox[tlength] = fbox.options.text;3 \  [+ O" b/ l
tlength++;
# D1 v. `# K% w+ g" O) z}0 \' K  v/ d. D% }
else {
  |* b  t# `/ T3 Jarrfbox[flength] = fbox.options.text;* g* T- w& D$ [; w0 E9 X, }
flength++;! q7 w& r) Y8 \5 N1 v/ r
   }
( q% W+ I4 |0 _$ B  f: M}2 p0 H  i: r3 [! p8 W; e" D4 b
arrfbox.sort();! d% `+ [, [) Q$ L$ @6 Q
arrtbox.sort();( R9 a2 @. w7 m4 ]
; {; G2 {8 C8 T' I
fbox.length = 0;. L- U/ [) \% S
tbox.length = 0;
7 J" s% S+ F; }/ Fvar c;
) u4 a( Z9 h, [for(c = 0; c < arrfbox.length; c++) {
- f# F; b& U6 H+ I3 yvar no = new option();
- e  ?: a' S( ~$ I# P* U; }9 Y$ yno.value = arrlookup[arrfbox[c]];
* g4 U$ W2 r/ E8 F' \/ y) @no.text = arrfbox[c];
. D, F* c3 Q% e: sfbox[c] = no;
1 d% E+ \4 G1 T" M}
2 z8 _' {3 ?* q- C: ffor(c = 0; c < arrtbox.length; c++) {3 J: Y4 \0 @; S+ u' A
var no = new option();
% [$ d4 W& n3 M; cno.value = arrlookup[arrtbox[c]];- J& Y! M- S4 _$ e1 B0 f
no.text = arrtbox[c];7 \1 i, V7 b$ h% z' E
tbox[c] = no;# ^- o/ @# s' N1 |( n4 o
   }
% U! P5 \- l, i- S9 }}2 j2 v( G, Y. y  ^. O- x
</script>  D; B0 m& g7 C8 v2 @) a
</body>
- A0 J3 }+ z! Y





欢迎光临 捌玖网络工作室 (http://89w.org/) Powered by Discuz! 7.2