Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"  ?% a; S- @0 o" C8 V/ R' C( @5 i' i
         c pageencoding="gb2312"
% e- {1 w8 {, r$ V) I+ t%>7 f* F' J; p9 i0 E/ A
<style>
' {8 B& f3 D# [.f9{ font-size:9pt; }4 ^6 a: `; o0 j% d# B6 h/ ?' ]
.bgc{ background-color:#aecaf9; color: #0033ff }
4 m& c) `% B- [8 n+ w.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
3 C- p& z4 u3 m) p8 C# S$ Z6 ]  border-bottom: solid 1px #4e7dc1;2 o3 ~, |8 Z( h$ k$ t; i
  border-left: solid 1px #aecaf9;: D1 Z& X9 W9 K/ e# G) }1 _
  border-right: solid 1px #5679bd;
0 C, J+ s+ T0 g7 Z+ p1 K  padding:1px;
! C8 ?# Y) |% ~: d) b  margin:0px;}
5 J1 |0 \0 O6 T. p) D& W0 i</style>7 u; U0 @5 w$ r' V0 _2 Y& `
<script language="javascript">
2 \/ \8 U& [) A  I9 p  M<!--# h/ {) f, K- @. j  i9 [; o
function rv()
2 ^3 `6 V5 h  @6 o  P( d{! |! ~4 a$ b+ o" M; B, R  r
  var val="";  O2 K. B% c9 k7 B0 H
  for(i=0;i<combo_box.list2.length;i++){4 o/ i/ m: o+ v9 V
   val+=","+combo_box.list2.value;
6 U+ D/ Z! l2 A9 W  e  }
5 c3 v' l/ l/ }  if(val.charat(0)==","){' q. N5 E/ `2 F4 \, Z
   val=val.substr(1,val.length);
- ~6 c- Q* k# [* ?# Y1 S  }
1 R; a/ t" {/ Y4 z! A0 \  p4 F0 O  opener.form1.frecname.value=val;
. |6 B9 C) w6 J. s  self.close();
% n" Q5 w# M& l( E$ ~2 I8 r3 d9 I* M}
$ K& B. w. K$ N$ Z- Z6 S. s0 W//-->% I# B, D" G$ A: x; h3 V- x- a
</script>
7 K: |2 m. n3 V% [: I<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">3 X- x* n0 w, V# Y2 c- P
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
4 ^2 T' A) ^4 G( b* _: a<%+ l3 `  Y/ a, ]$ Q3 r. \4 \
  cdatasource ds=new cdatasource();  //数据联结bean实例% x5 @2 o+ }3 d9 }: v% r
  java.sql.connection conn=ds.getconnection();
: F" }5 }! S6 p! m) K  java.sql.statement stmt=null;
/ y# c) S- U5 C1 W; F" T8 b9 {8 N/ s  java.sql.resultset rs=null;% @$ {  Q  \% s5 x$ P
  cdatacheck dc=new cdatacheck();
8 a& Q& M+ ~3 T0 O; Q%>
! E+ m2 P2 D" Q' h+ Q6 v3 T5 c5 m) r<%5 q' J. S3 M( P
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 \1 {2 u5 e; d. }+ H; D$ q' L
stmt=conn.createstatement();
. m2 n' s$ M9 grs=stmt.executequery(sqlu);% a) Q% C& y  M3 l! S
%>
; E  u' X* Z0 r8 g6 ]' l8 j% G! J<script language='javascript'>
% F4 y5 H7 h6 z* _- g0 ?: Varr = new array();
5 }% s5 Z# M9 f, R1 g' D<%  int temp=0;! Z& m& h( `3 u
while(rs.next())
! ?8 E- a8 E6 }) x{/ `3 {7 A. @: O5 L" {
%>
$ g4 I3 n% e, }! j; Q9 Uarr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");& Z4 A: `, O- H  r7 y0 A/ m0 \
<%4 g5 h. ^/ i6 C% `8 I  Z& u
temp = temp + 1;
4 L. v' A  c/ I' q7 I: H) b! y: m}- s# J) `* s( I+ \" X
%>. N# w  Z) b3 T% ^5 P# \
temp=<%=temp%>;4 [6 C  w, X6 e4 c5 h
function changelocation(id){
# w6 u1 g+ z8 j- ?document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 - \" K8 p7 s/ z
var i = 0;
) H! e" @5 n1 x7 C6 ndocument.combo_box.city.options[0]=new option('-------','');
5 j: E3 \$ ~5 o- G  _7 Hfor(i=0;i<temp;i++){ + G+ T* V' ^( H7 C1 l, M: ]
if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
! v9 n, M/ c1 w; i6 ?document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); / [* d6 U( W; |
}
4 q; Q( t6 h  t} , V4 F" m2 S; n, h4 O- u
} * W2 k; U2 V# c1 O
</script>
4 n1 l5 L& K8 T9 j9 l
$ @( E7 P% {& b7 o5 T<form name="combo_box">
% y: p- M% h# z  Q3 P( R<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">( F, }8 c2 ]/ j
  <tr height="24">
( k7 a7 b( E. |! Y    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>; Q1 G, o  O' R  S# u' W
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
6 H. a( r$ Y  h4 R  n  p' b    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
( r* p( J0 o. o% e    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
8 T3 B# g& T7 e( \  </tr>
3 {0 B/ u. y( ], w# j: E. H1 o  <tr> , F8 i- r$ Q# G6 I1 x: @8 h( W, U
    <td>
9 U$ ~3 C- H# b$ P. v  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">5 o% p0 O5 s4 l
  <option value="0">请选择部门 ---></option>6 y6 L9 M  `* R: }* M; R
<%- G+ L, _! q6 M" C: a( u6 I/ K
    string sqld="select * from tdept";' F3 Q/ E# C' f9 }( G0 O1 E
stmt=conn.createstatement();
* I$ ^" m1 @* V2 Z7 o8 U* n- W, krs=stmt.executequery(sqld);
" v& m/ e* Q: b* E" l3 Z* Zwhile(rs.next())
. v2 K/ @: e& C3 w8 q2 h- }{# _2 O8 X! j1 i: Z: T  l8 b
%>
. b. U3 n6 V; S3 q  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>3 I( x" a2 m: U* n0 o- |
<%* E& z8 c. Q2 z+ b2 E
}- O& g- N6 j+ u6 O$ W( \7 D/ k
%> $ m6 ^8 l: E# O/ p8 z' G  k
  </select>) N$ D' T' x$ E3 S3 E6 x
</td>4 e% I5 _3 s8 N& Q9 B
    <td>
" f4 @" a8 V8 t2 t3 k! j  y( L  <select multiple id=city style="width:150;height:200" class="bgc">; L$ s$ C" J+ o2 q; B
  </select>; D+ t" y8 v% h
</td>
& _1 t& X3 K- ]8 a    <td nowrap align="center" class="bgc">
% R2 W0 k: r( ]  s4 R3 l) G  <input type="button"  value="<<" class="buttons">
( Y' z9 r+ g( d: R8 a8 [. A3 s  <input type="button"  value=">>" class="buttons">1 ^4 w) b; V- t* ~1 v9 i/ x
</td>& _( }! \# r  o* g, G
    <td>
" D; m. C, s4 H( B+ F  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">% u# L2 L; S2 g+ u/ _1 u0 g" t
  </select>
  y. f# d; ?9 D% H. i3 R</td>
2 A; G! H% E/ [4 h( u9 C  </tr>
" U" j! [# T: @4 J+ z5 u& {    <tr class="bgc">
$ X3 F" e. N# J3 H    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
2 ~7 ^! `- u8 ^  </tr>
- x0 j2 x( c. b, x  [</table>
' P1 j- r& P, A* \9 Q. l  K" n</form>
/ w, h$ r% V; A! P! @<script language="javascript">9 Z; T2 V" y" Y
//人名移动3 M7 i* G, @- [' p
function move(fbox, tbox) {
9 e2 e$ |5 c: X* P$ {' n% Kvar arrfbox = new array();
7 B1 g# a+ Z" X- w; b& U1 q. vvar arrtbox = new array();
; |/ t, q1 E) @7 G: ~, y+ Mvar arrlookup = new array();
4 L( ^8 T# e- z# V  \- U" K7 \var i;
* ?# J3 J: F; q( ^4 H. H, @$ |for (i = 0; i < tbox.options.length; i++) {  e7 P$ |8 a5 B% |: P8 ?3 ^  m
arrlookup[tbox.options.text] = tbox.options.value;  G/ z; {) o9 g. L" o8 F. ?( D7 h
arrtbox = tbox.options.text;/ C1 I: |; a2 F, g
}# t4 n3 k3 N/ F& ?) k7 b8 k
var flength = 0;
7 b& X( H1 A: D; ~  E, Y# avar tlength = arrtbox.length;. Q) h7 _) g1 S& D, ]8 L2 L! {
for(i = 0; i < fbox.options.length; i++) {
  S! ~# [, Y+ c% z- p: Earrlookup[fbox.options.text] = fbox.options.value;4 l" _$ ~4 p7 O# f4 E6 I8 B
if (fbox.options.selected && fbox.options.value != "") {( \( N' |8 d) J8 a5 x! o
arrtbox[tlength] = fbox.options.text;
- R5 \( y! R3 b$ H" utlength++;  W& K9 I+ @( G5 d# ~+ n* L
}
: S+ W: d7 {9 o# u3 H6 ^4 s2 aelse {  C4 u: o/ L2 j: B7 f5 x
arrfbox[flength] = fbox.options.text;
: E. J. D7 l" R0 @" ?$ D6 m7 tflength++;& Z2 h& a: O0 \7 |" S2 @- I0 M3 c* F
   }
! C3 K: |% b. ^4 j0 f: s- g}8 R& V4 x1 i8 [& z0 x3 R
arrfbox.sort();6 m) F- S' s: G/ v1 f4 R' j7 z
arrtbox.sort();! M' J, H5 R, I- q* ?- a. }9 ^
, D2 C# ^! i3 `1 i
fbox.length = 0;
  F$ ]' X$ n) k) S* rtbox.length = 0;+ \. b4 d4 ~' f- J' Y
var c;1 j) {$ G6 h, R
for(c = 0; c < arrfbox.length; c++) {5 u/ V, j! _2 X6 \
var no = new option();* z8 A  |" C3 w. y6 d: F, ~! B
no.value = arrlookup[arrfbox[c]];+ y1 l7 Y1 r& @) t# N5 t
no.text = arrfbox[c];
0 v. y6 q- }, o( T. X5 ]' J2 Bfbox[c] = no;+ T6 m: z; Q& a6 l
}
* A8 G' x: n: b: X0 C! D+ Ffor(c = 0; c < arrtbox.length; c++) {
$ d% m& b. p5 p0 D) Evar no = new option();) M3 e  s) g' i/ K, k. N
no.value = arrlookup[arrtbox[c]];5 m% D: _( e: O7 S; _0 N
no.text = arrtbox[c];0 D; u+ O4 n9 X( B0 Y' R
tbox[c] = no;  K: x2 i% ?  d% a. i( o
   }& Y* U' z( O' ]0 ~! t- h8 T
}3 n+ w  T) _: Y) ^( D: E
</script>& n% l1 }0 \' k9 Q0 R( i! Y3 ^( ~
</body>1 Z7 c$ N9 M5 N( p8 G, @( p





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