Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
; q. k* d; \4 o         c pageencoding="gb2312"( x5 k3 E' l& V: e% v1 Z
%># b6 L3 i1 Q1 I$ f/ J/ R7 p
<style>0 k* E: k; X' ]- u, ?
.f9{ font-size:9pt; }
: J% V% l/ @/ v+ g3 L* A6 ?/ ^.bgc{ background-color:#aecaf9; color: #0033ff }' F) {' O+ L( m: J6 E8 C/ ]7 n1 Z3 e% _$ }
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;% X8 C; d  n2 T/ R4 H5 y% k  r
  border-bottom: solid 1px #4e7dc1;1 a3 d. P9 j1 Y9 U( E& m
  border-left: solid 1px #aecaf9;! t2 w+ Z" q/ Q( K
  border-right: solid 1px #5679bd;
1 S3 J! s3 m, l& o1 j  padding:1px;* s7 W$ C# n: [
  margin:0px;}! d9 E& [# t% v5 o7 ?$ N( ^, N
</style>
$ a% N- |! d8 [" _9 q  J& Q3 d<script language="javascript">- B5 W7 S  W/ v6 A
<!--* {; Y7 E$ d' g
function rv()/ k" K3 ~+ P& g& a, U+ c) B
{
9 B" l; k& |* h0 E  var val="";( o* I* \  i- `3 w6 f
  for(i=0;i<combo_box.list2.length;i++){1 Y4 e# z' {8 ?
   val+=","+combo_box.list2.value;
4 _6 O1 }& l* p6 w2 G9 o9 d  }
/ m2 c5 A. c- v/ Y+ [6 H9 Z; s  if(val.charat(0)==","){
8 j$ m$ J+ W# o$ i, x8 W8 ?& a   val=val.substr(1,val.length);2 j1 A& `0 @: Z: {. ~& s. b) I0 V) T
  }  u3 |6 p4 F$ O" K0 c- I
  opener.form1.frecname.value=val;
  u& Z/ v' F2 D! g' v  self.close();
' v' Q; w/ z4 d6 @- s7 T( Q6 N, O4 \}
6 v+ Z% q$ }6 g//-->
/ p  k$ u1 o  Y2 @0 I% n, f</script>6 K% \% g% F# i5 B# s
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
7 \2 }/ R! @# @. i<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
3 `6 f$ H! x# @7 D4 h# G<%* V/ \3 d% `8 N, W# I
  cdatasource ds=new cdatasource();  //数据联结bean实例4 a' _1 u; h! j4 S$ R
  java.sql.connection conn=ds.getconnection();8 {) L% U" f' v: l  c/ |' @
  java.sql.statement stmt=null;
- Q) {6 L8 k, Y- ~( e: T  java.sql.resultset rs=null;
7 i" }; G: b0 u, G7 P0 }" X  cdatacheck dc=new cdatacheck();
& K9 C) z8 k6 l$ l& |%>
5 i& f; Y* V8 k; p% Z6 ^<%+ w. S/ z8 [" l0 p2 t+ F
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";
2 ^9 s* V9 O  E0 g% ^- k" hstmt=conn.createstatement();
+ T: t! `% `; ]4 ?  O5 @3 p0 @rs=stmt.executequery(sqlu);
6 [7 w6 e# C' X0 I+ c5 _%>
% H+ N2 [; n  C  f<script language='javascript'>
% @; l6 R; i1 }+ Harr = new array();
& b; p: d  M3 R: s: p<%  int temp=0;
0 T" r. |8 u( R: n2 M* ^while(rs.next())) A# U* m3 h2 u6 {
{
6 ^8 h" t. f: ?" q8 X( q2 @%>
5 O3 S# E. g/ h2 t: r! R# Z/ varr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
( d; |, U8 f8 M8 g! y! u& W<%
: w( R& d) B6 X  m% Etemp = temp + 1;, L; o" w, W6 W- G) F
}( S3 R- }1 d/ C& o5 W3 y- d0 j2 V8 O$ L
%>
, _$ j+ u8 t5 ttemp=<%=temp%>;
' P. e5 l! B$ m- Q1 [) efunction changelocation(id){
0 X/ n/ Z6 ]2 Y& J+ Q- ]document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 7 z5 Q4 P5 \0 V( K
var i = 0; 5 u! G- F  W: p
document.combo_box.city.options[0]=new option('-------',''); ) @0 n0 _& m. W( N
for(i=0;i<temp;i++){
  Y- E; r' g% D0 A0 g9 qif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] : f& t4 _; E# s2 X3 s
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); % G5 n+ F$ k7 J/ L) ?
}
0 B" L1 j* x6 t' H2 G7 s1 A% |}
/ A+ K, C1 x1 C0 ~! d3 _) M# K} 2 v1 u" R8 u, d# I
</script>: J- K7 ?( h) e: f
* g% K9 W! e+ C- ]4 ^# d
<form name="combo_box">
, L9 ~$ [3 s+ D* h$ `# a5 S! B# ?8 E<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">2 |1 R* j8 N, t
  <tr height="24">
5 Y) r9 d1 Q5 _8 b    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>1 E* g4 a4 q( S+ N$ O7 t6 v
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>( B& J4 {' b" j  V; Q
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>: [3 j' r' t% {& z5 F) l6 q
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>  S# ^* M5 [  d  U) n0 r# A1 f9 _
  </tr>
2 Z; j7 b1 N: D% `% s; M6 L  <tr> " j$ B' U' s2 r5 t+ @; I
    <td>+ @4 Q* @/ Z: N
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
" U3 E5 `0 n% J) |0 D- b: j) x$ l  <option value="0">请选择部门 ---></option>& a. r- C/ t; k
<%
8 G! H" w2 Z1 N2 z# G    string sqld="select * from tdept";9 n: T. y: E2 Y7 U+ J) b: c/ ]" L
stmt=conn.createstatement();
8 A6 n1 W1 n/ H7 ]4 T' M; W! y% hrs=stmt.executequery(sqld);( `& e) `, Z# N% C
while(rs.next())
6 y# ]% i# U. P+ r{% E; i! Q  Y3 _
%>
4 U4 c, r  H1 k6 h! [  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>- W( [! u+ W2 K# M( ?2 k6 V$ C5 Q+ f/ z
<%0 |8 S9 I& P( v4 Y3 l% @
}
) r1 L( r$ M! }7 t: _%>
- @, k# @+ X/ [/ F- u: v  h  </select>' l+ w) d& U( E
</td>3 f# V8 L* {# u* p4 D) H1 \
    <td>1 s: _  K1 r' p, g
  <select multiple id=city style="width:150;height:200" class="bgc">* x) W6 k7 ]0 |7 \0 a
  </select>
3 |3 o9 z% ?3 J2 \; g3 I</td>
1 v3 M1 Y$ F3 ]6 C! b    <td nowrap align="center" class="bgc">; z0 k: x# Y8 V! h! J3 p: I
  <input type="button"  value="<<" class="buttons">
* D# m. o9 ]& q) U5 C3 {  <input type="button"  value=">>" class="buttons">
% v8 n, f% N: X; U% q</td>
$ X) D& l1 m( u9 E+ P    <td>
( m$ I) k6 A, }  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">0 e: b) G  _  t  W
  </select>
; B1 `4 k3 G/ m$ n</td># V/ \, n. j( f+ b7 D. |
  </tr>+ t5 _2 n1 M/ e- [" x
    <tr class="bgc"> ) F- I( e1 g- s6 H! A. S, l
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
$ y+ w4 h" h5 \( ]% x  </tr>+ U; T. t* W) _( s1 \1 ]6 t! I
</table>
! H$ r# \# F) A  t( E</form>
# Y% P* b9 N! [6 L<script language="javascript">
( M- `4 _+ G% z2 ]  N//人名移动) r$ M" K* `( E
function move(fbox, tbox) {1 }2 g. N' U8 _6 v
var arrfbox = new array();  p" q$ U. f  q; Z6 B* y$ e7 E! W
var arrtbox = new array();& A# C9 z: `, Q# H1 `6 V* r
var arrlookup = new array();
5 q0 m4 D- c# T8 ?- bvar i;
8 X4 X  _/ f+ q$ m3 Hfor (i = 0; i < tbox.options.length; i++) {1 l( `8 E( T4 n! e4 T
arrlookup[tbox.options.text] = tbox.options.value;7 }/ z, l1 P+ K  ?0 j" C* t/ X
arrtbox = tbox.options.text;
/ d' L6 U* x2 S( A}
; A* X, U8 b6 Wvar flength = 0;
5 [. A, ^4 o" B3 I8 J0 Avar tlength = arrtbox.length;$ p+ ]# p9 d4 U3 T' O  o/ }
for(i = 0; i < fbox.options.length; i++) {- ]; C  s8 D* Y7 u7 F- P( r% Q
arrlookup[fbox.options.text] = fbox.options.value;, r) _" C) C2 U8 i9 {9 C% x# v7 |- {
if (fbox.options.selected && fbox.options.value != "") {
/ |' {% |; E; o2 \: p& `arrtbox[tlength] = fbox.options.text;* `3 G& }& ]5 D3 D
tlength++;5 K" W6 p$ @/ Y
}3 \' o& Y/ Y0 m9 o# t
else {; ^3 \& o1 i6 Z( W6 h, c
arrfbox[flength] = fbox.options.text;
: f2 t/ X; n4 Q$ W* Sflength++;' k) b) ^( y$ ]) b
   }: N) ~4 ~- X' A& @* l
}5 x! e' @- \8 o! l" t
arrfbox.sort();
9 u! ?  M# i9 `9 D" L/ ^arrtbox.sort();
0 b5 Z9 B2 Y/ H) k/ a- H2 z* k
( A% i& B, t% S$ @' Lfbox.length = 0;
" @  |1 h# w  d3 x1 E0 Itbox.length = 0;  a* i5 X3 O2 U7 g6 g8 p0 z
var c;9 Y4 ^0 [& N+ u# T. N3 \
for(c = 0; c < arrfbox.length; c++) {
$ A  X" L! C' pvar no = new option();
0 I1 r! `" b5 Q9 |no.value = arrlookup[arrfbox[c]];
- v+ Q$ H$ m3 ]9 g6 B9 q2 [# _( y+ Fno.text = arrfbox[c];
% Z% E# c! s7 Z4 zfbox[c] = no;* {1 t- l- [* K( F3 h5 c$ O- M8 Y
}' R% `% `; X: G8 c+ h
for(c = 0; c < arrtbox.length; c++) {" l3 ]0 e: U2 O; o3 L! i
var no = new option();: f1 Q: y# m  q0 b# O- N  z
no.value = arrlookup[arrtbox[c]];1 q7 V; Q. ?, c& Y4 [
no.text = arrtbox[c];# [8 G0 t+ g, ]0 y
tbox[c] = no;3 _$ p$ a2 z' C
   }  n" p( h+ H7 j! T; k& c4 }( G% V
}
0 i; s2 T' o0 I9 ^# h$ R3 w</script>
* P3 r; m4 U9 p  o. _  z</body>& O2 E5 m) r* T' I





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