Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"6 W4 Z# S2 L- B
         c pageencoding="gb2312"
6 `4 J( d. T1 c- m: i* M2 ~%>
+ W2 r4 N1 _, y6 C" F<style>2 Z3 H2 j$ Q7 v9 q1 q' w8 |, g* c. ]
.f9{ font-size:9pt; }
8 [% L" O4 x: f5 ].bgc{ background-color:#aecaf9; color: #0033ff }
# y- _* Q) O5 E4 l$ C.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
/ S7 R" K# b4 w/ g  border-bottom: solid 1px #4e7dc1;0 P: z  O; r" w' t
  border-left: solid 1px #aecaf9;4 w& Y7 g/ q+ y5 E
  border-right: solid 1px #5679bd;  M" [0 }* k/ h4 R, @& ~
  padding:1px;
/ d* M7 q7 ?. Q/ b) R  margin:0px;}/ [1 F# S" X$ \
</style>; l9 _# j5 u. f. w# X
<script language="javascript">
1 {8 M" r9 U& _! n9 T0 t  i<!--
! t  N1 R; z$ Y4 ~function rv()
, Y% E4 I* ^, t  j- g. {; L0 r6 T: X{
& S& Z/ W- ~: C  var val="";9 \/ \( `+ I" N2 [7 T! _
  for(i=0;i<combo_box.list2.length;i++){
2 L5 s2 d, N0 p# H" O& H   val+=","+combo_box.list2.value;
; L6 o2 [; D" q+ R6 f  }
7 a/ n3 n; J* v) N  if(val.charat(0)==","){
3 D7 b( |' }1 X) m% [  t- Z   val=val.substr(1,val.length);
" m- N, g8 q! h+ t- M3 v8 m, k! ]  }9 w  E9 Z; c5 P- Q2 X/ u
  opener.form1.frecname.value=val;
" [/ _: P, |$ S$ Y% A) t) ?  self.close();
6 `/ L/ S( N8 `) Q7 {}
; c  s5 r1 O4 P9 D; n, s# X' u% q//-->, B% j% O# m& Q7 w2 f3 j
</script>
5 z4 Y! {. W9 L) n) f<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">0 ~: _) m2 P/ |3 N( q
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
; H0 H6 F8 `& [" N1 F' B<%
0 J+ d" {9 K2 Y: [  cdatasource ds=new cdatasource();  //数据联结bean实例
7 t0 M. [, e+ @! ?  q! W* }  java.sql.connection conn=ds.getconnection();
4 |+ P; g& ?: l/ M* [  java.sql.statement stmt=null;2 t6 g( @9 k" J# p# S7 f- I2 V* ?: g
  java.sql.resultset rs=null;
' d1 f3 H* i! c$ n: a  cdatacheck dc=new cdatacheck();9 a) [' ?! `5 U, {- c# c
%>
; {+ g& Z( o3 M; `* ^# y8 B- G: U$ \2 K<%: u: k" J. }  d8 \$ k& T6 H
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";
. \* V! O# K6 {/ j/ J; a& c- s, fstmt=conn.createstatement();6 k) g  S  ?5 d; T1 \: W
rs=stmt.executequery(sqlu);* X' {/ m- H! y. x
%>2 H4 Z3 Y2 P+ [$ A5 O) o
<script language='javascript'>
+ q) |  W( c, L" |: _& }/ f+ Yarr = new array();
: x, ]3 X4 E7 h- w. k  q<%  int temp=0;4 P, y% {5 g# g5 i
while(rs.next())
: L: m8 \% g' t0 V, j9 G1 R{
. t$ ]4 H+ i2 s4 a%>& ?' ]4 R2 i- E3 Q) V' d( \
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");* \! \4 q0 n6 u
<%. n. e' K  ^9 ^1 I/ c  X
temp = temp + 1;
& ?3 v  l8 v. M% s5 r}2 D- C- p) \" P8 F3 [0 L
%>; E  {7 i1 k" _% n/ T! s% {
temp=<%=temp%>;5 J7 w9 f$ v: s9 j4 Z# M
function changelocation(id){ * K9 n' d  F+ l) C9 B. L1 ^
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
+ P; u$ D* \- n/ @var i = 0;
5 w3 j7 g. o2 F$ G* xdocument.combo_box.city.options[0]=new option('-------','');
- X  Q; H) p7 l4 T8 Z5 z% J4 d2 wfor(i=0;i<temp;i++){
4 K% _; Q9 R6 {4 I/ [if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] % N& e! y" [! P
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
0 k9 P( }0 B" j} 0 ?* W5 b; F( ?% \6 d/ U  k
}
' c' r+ b- {3 \3 j- {} ; t: R6 B/ m1 ]$ C% u6 I
</script>9 U  m1 I, ?. |
7 ^+ F7 T6 v6 \  ?* M: t
<form name="combo_box">
4 J# }3 F3 c% c# f- Q! Q<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">1 r8 b, ^8 v& k! t4 c5 n8 F9 T: ?
  <tr height="24">" l- n# M; a3 y: r% N: t! o! \
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>  U2 U8 n9 n& r/ v! h
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>4 j, L* T! ?9 u1 B' M+ M! m
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>' `0 W. l. s0 _% y
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
8 p; @# u$ l5 C/ x  a6 O! T% Q. B  </tr>3 g  J6 Y) G, A$ L9 a% g, W
  <tr>
: K1 p" @$ u. w    <td>2 [& S1 T" {! |/ Y* t
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">" _; f, t; ]4 I& G- m
  <option value="0">请选择部门 ---></option>
& O1 _3 ~1 k( x- b<%
0 E) l! g5 J. ?9 w# [    string sqld="select * from tdept";2 w6 p0 e) u, f) b* \
stmt=conn.createstatement();6 M, I" A" o( b% Z
rs=stmt.executequery(sqld);" e" ]3 G5 s4 K( T/ \4 Q, [: ^
while(rs.next())1 V6 ~' G2 M1 u8 G: |: k
{- j- G' \# p; q) Q  V2 G
%>
2 U' y: T% e: @  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option># g8 e, r! T: O6 h- Q# b
<%# [% T; s, w  F" l
}  b; R7 y' |: P* }2 k( }
%> 8 h) O9 t1 J2 A: q1 i; y, `
  </select>
  k* ^0 X9 p  C/ Q6 V</td>
* D: x/ o9 c2 _& b    <td>. {8 I, W& b8 N* F1 |
  <select multiple id=city style="width:150;height:200" class="bgc">
* h9 m* D7 Z5 }7 U  b$ c  </select>
& I! c# \6 F9 N& N$ ^0 p$ m+ a% I</td>
0 H( ^2 R# m2 G    <td nowrap align="center" class="bgc">6 ?' E' u4 Q5 e9 _, M
  <input type="button"  value="<<" class="buttons">
# T$ U0 W3 T7 \/ |  <input type="button"  value=">>" class="buttons">/ b9 \' ?' @% E5 A) y
</td>
. @7 J+ ~2 n7 H: |    <td>
# V/ k' K3 G1 i. I6 C  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">. J8 l) |3 _' j% D9 r, q
  </select>
+ |4 F# S& {' z" d& h2 M- i0 ^1 G* G</td>
/ t! F& S0 i6 Z* {. H  </tr>: y' |& r* F! D. i. X
    <tr class="bgc"> 6 Z$ g/ R& C$ t- c5 T/ ]4 y
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
7 U7 L" W; Y) B, S  o* [  </tr>2 ~/ a8 H& t; u  A$ R5 F5 L
</table>
+ `9 I6 ]( V: r! [2 O! Z% {$ R</form>; n5 p! Q; |/ }' b; Q
<script language="javascript">8 N) j+ ^* P. g$ W+ e' p1 ?
//人名移动+ i4 _; k9 {8 i& v
function move(fbox, tbox) {
4 [1 O5 f  ]9 \. [var arrfbox = new array();' x; h& c* D/ ~  G& M9 G
var arrtbox = new array();5 I! v5 ^0 i! g5 x5 d
var arrlookup = new array();3 F7 I5 q# `9 U8 l( }+ R& |
var i;# S) ?: ~' b6 N# I; @7 a
for (i = 0; i < tbox.options.length; i++) {0 o2 y0 ~+ I' `; |+ E: K
arrlookup[tbox.options.text] = tbox.options.value;9 @2 [; f/ p1 _9 ^- ]7 }$ g
arrtbox = tbox.options.text;
1 K) N0 g( B: S; b  t}
. S6 o4 u/ ]$ D) N. P+ u! zvar flength = 0;# l9 x6 ~% c( Y# L: X4 y
var tlength = arrtbox.length;
9 }7 W& k# r$ k- Yfor(i = 0; i < fbox.options.length; i++) {3 s/ t5 @9 W" o- W
arrlookup[fbox.options.text] = fbox.options.value;
% M  T# g' y: Nif (fbox.options.selected && fbox.options.value != "") {
/ k' r' }7 s# g6 Parrtbox[tlength] = fbox.options.text;
8 o1 I8 y5 x5 Stlength++;1 Q: W' W+ q$ n0 E
}. H& x4 A% L& h9 g! U7 L/ q/ r
else {
. M; v1 E, ]7 M% S7 Q& _arrfbox[flength] = fbox.options.text;% ], U6 y0 A' ]* D# @- f
flength++;
* k$ \0 D( T' l6 p) w   }" b/ s8 [; |( ^7 D/ A$ P
}
5 H- g3 V+ a- \( @4 d) W: ?4 Rarrfbox.sort();
2 p" x% N, e* X& W6 C' Varrtbox.sort();
( W& p# f5 L2 s) j
, O# y7 E3 b$ v& r$ a0 ^fbox.length = 0;. o: s. _" @5 @- I& K/ M
tbox.length = 0;
+ s: V9 L/ Y( J2 Z. ?4 h+ H) Ivar c;6 ?  u5 F) P' u8 o) A2 `3 l
for(c = 0; c < arrfbox.length; c++) {+ E3 e. p8 z2 D% N0 y
var no = new option();
* {  a; b7 ?+ R; o" T  ^* l9 ?no.value = arrlookup[arrfbox[c]];. n/ W; N; G- Z& h" G
no.text = arrfbox[c];* B- `/ [4 A- o# I0 l7 e$ y
fbox[c] = no;8 k' F: Y7 H4 k
}
9 `, |# f9 x( u) N* Ufor(c = 0; c < arrtbox.length; c++) {7 O; _  Z9 ^; u. S8 _# D% J- z
var no = new option();
1 ]1 }+ H+ }3 |6 B/ j* Qno.value = arrlookup[arrtbox[c]];# \; o8 t/ Z/ V& r+ z
no.text = arrtbox[c];
* e) _! J9 F- atbox[c] = no;  A! p# b2 U& x, U
   }/ @( U  N: S: o
}2 D1 S- Q7 z3 H! h+ ?0 u. \7 b
</script>3 y: j% T) f2 T- ~: U- c5 ^
</body>0 U8 K  u+ ?/ w! I4 o: P





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