Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
! ~1 i5 @0 H: s9 L$ T         c pageencoding="gb2312"/ a2 I% b$ W/ D  P# b
%>8 g  a) ^* G# r8 g3 B. z: J
<style>
" h+ {' N6 x7 p' B.f9{ font-size:9pt; }
3 J, a% n; v) r+ _1 r& u& S' u. P( s.bgc{ background-color:#aecaf9; color: #0033ff }& v8 k6 b1 q1 e2 e4 U; J
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
9 s1 S) \/ f" \9 Q7 D  border-bottom: solid 1px #4e7dc1;
6 E: O2 }- F) z* w' ~0 P) u  border-left: solid 1px #aecaf9;
( n, i& M; O; o2 n* t1 C  border-right: solid 1px #5679bd;5 Q5 t- h  w2 f0 h1 Z
  padding:1px;
- g9 |4 v: x3 c) v8 d# R  w  margin:0px;}
/ N4 }5 P% @5 ]( H5 f0 b7 {: j4 x</style>
2 V3 f: W7 T/ O0 @+ t<script language="javascript"># ]' B  [* M$ w/ j
<!--
. l. t2 j: Y4 \3 w' G2 u# }function rv()) _4 Y7 t7 C0 X
{2 Y5 b- H1 q5 z% c
  var val="";
  N( h7 Y# R: ~5 {. |3 B  for(i=0;i<combo_box.list2.length;i++){
( t; {+ |4 u% H2 ^* u   val+=","+combo_box.list2.value;
9 f, I# z' N0 R) z8 D( k  }
0 E1 U& h- G7 c5 H8 N; |6 A  T* M  if(val.charat(0)==","){
: L7 K/ q$ \3 F( p! Q2 I: B/ z   val=val.substr(1,val.length);
. ]0 m  i/ p1 C+ z$ {' @8 g1 ^: z# |  }6 \+ \+ Q4 g! i  A3 ?( {* r
  opener.form1.frecname.value=val;
) r" j- V5 f% n3 N  self.close();- H" `2 E) R, w
}8 U. Q8 U% j6 P
//-->
+ S9 P3 r& p5 N2 L# d; i</script>5 b7 m% U3 i. b5 d* ~3 @6 O$ f8 s
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">6 j& M" [) v0 S6 Q( K* E/ o5 I$ ~0 s# Q
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />% d4 x! H9 W0 X% N: q$ ^# \
<%
, S* L- `: R6 U4 T# R3 X5 h  cdatasource ds=new cdatasource();  //数据联结bean实例
2 p) V% y  [9 P7 Z1 d) A/ T0 w# E; [" l  java.sql.connection conn=ds.getconnection();  K5 T! a* C2 p9 k& t3 ?: t3 S2 B
  java.sql.statement stmt=null;
7 k7 C- ^4 d. |' L: ?1 b! k+ L  java.sql.resultset rs=null;- i/ ]" Z& Q7 U  r& v: ^5 R
  cdatacheck dc=new cdatacheck();- R4 C( B0 u* F; b9 d
%>7 x3 I$ f8 L% m! |( s; C: u# T) R* X
<%* E" m& h, E" D% l; ^* v% 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";# b' G( R" Y: [3 v/ @
stmt=conn.createstatement();3 b% c! U9 w( z- t
rs=stmt.executequery(sqlu);
0 o7 l1 Z! J7 y$ y2 E0 {3 H! W* l%>9 i9 b0 e1 @. k
<script language='javascript'>
& e/ h3 h. C4 ]# Earr = new array();" W0 A; ?& X1 F! W2 n. x5 w
<%  int temp=0;1 n4 T! {4 `$ R% y: R. n% X
while(rs.next())
0 f6 d  s9 p. ]- i" Y' i{
: h% t- D2 g' w+ X! z  s%>! e8 t7 @' O" p; K, R
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
" E& d/ E# H* Z8 v) O<%& N5 q" L" l1 Z6 l% l
temp = temp + 1;
6 w4 u- y5 V+ f2 Z, A. R}
* {+ z% b( v5 ^%>
* Q; H2 h) J% j8 o& C) y$ j2 Htemp=<%=temp%>;. ~9 o; e' [8 g$ X
function changelocation(id){
* ?0 e  b/ Y) i* cdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
3 v+ r  L$ B  A% mvar i = 0;
6 Y0 A0 h' A4 N  l- O1 C: Tdocument.combo_box.city.options[0]=new option('-------','');
6 B: Y2 |3 V2 d/ `$ u7 N, ?# E3 v4 bfor(i=0;i<temp;i++){
! ^) C+ |. o4 C- Y9 |+ k% tif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
7 g" B2 E9 \; |1 g! Q& w1 `& qdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
% a, Y8 V1 x" u}
* B# N! w  i! K- B} - s. a, J' r$ m3 Y3 m0 @% i
}
) m- K, u7 C# S</script>4 ~* H1 f0 _3 p# M- H
3 h# B! D- f% g
<form name="combo_box">
9 O( n% e# _4 q<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
/ K/ v( [# C2 ~/ d& P  <tr height="24">
+ q' `( D# _/ T- U* p" D) O    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
  N0 B& z' T, U& y* S+ O& K    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>* W/ R. P6 ~! Y' Q
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>/ J' G' x0 v8 Z2 k& m( C
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>" H( a) l, i" M$ i( A' f! g
  </tr>
* U4 c9 {, h: f' G. f$ C  <tr> ( D% S, @: Q& d* C# M9 S: q" D5 ]
    <td>
+ E+ Q6 X2 c5 i) C  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
, e* u$ U. S  c  <option value="0">请选择部门 ---></option>6 O) q% H6 z# m
<%
. I- J; E. _7 s# k7 z    string sqld="select * from tdept";+ C- e7 ]) T$ t2 K
stmt=conn.createstatement();
+ R' q  M; J% a% j5 R/ Q) S) `rs=stmt.executequery(sqld);
# V/ g2 L, l0 q: f& }8 P8 Jwhile(rs.next()): _4 W3 ^4 Z# d" D8 @+ W5 B
{1 D! A; l2 _3 x; \- K2 O
%>4 C2 P1 S. b% h% m3 g9 l
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
0 P5 f! J( `- B+ L<%! T9 z: W9 _6 C! y% Y
}
8 H7 \: V+ s0 ^6 n& b9 }; A%>
0 g# G4 L, F" j) S0 |) w  </select>
$ {% K2 h- ~5 m. r# n</td>
5 g. ~4 D$ |9 p1 c    <td>4 r4 r( r& g  Y& c( C
  <select multiple id=city style="width:150;height:200" class="bgc">
1 E, b4 Q& p; F/ z. k  </select>9 c& k4 o% `; _
</td>5 B* `5 J) q2 a
    <td nowrap align="center" class="bgc">
3 D2 v* Q' n% X  <input type="button"  value="<<" class="buttons">0 C+ n6 ^, `/ F' R2 y
  <input type="button"  value=">>" class="buttons">& G5 J$ ~/ H6 J! u6 T$ _
</td>
1 M; N( M- X0 |+ h( S; r9 m; `% |    <td>
% e: a# U' [2 g' ?. D  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
9 M  e3 z  D1 e  </select>
+ s! [, ?* o1 |) @0 z% H, }</td>
  {3 }4 F; O6 s& j$ L" E  </tr>- D+ P! |6 V1 k
    <tr class="bgc">
& a5 z, E( I) s/ j2 v9 t    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
2 z1 m* I5 I) E5 b( x  </tr>- w+ v5 K  Z9 {4 Z. z& A( `
</table>+ Q% W, Z1 l* i' R/ F1 y/ k/ Z
</form>/ W7 v$ C3 Y$ J. X6 U
<script language="javascript">
! t* _# n9 R. T3 ]0 G8 w1 C//人名移动* r3 w* C* K. J# r
function move(fbox, tbox) {
5 N( A9 l5 i4 S' ]- x" ~var arrfbox = new array();
$ J2 Y- _! `5 R% @var arrtbox = new array();( ^3 f. Y' Q" f  v; S* K9 P. _. P
var arrlookup = new array();
6 q, E3 i6 n8 g) G' k* U1 Jvar i;
' n9 D" h+ `+ i- J% ?2 g8 jfor (i = 0; i < tbox.options.length; i++) {
: Q5 j+ M" n: F9 ]arrlookup[tbox.options.text] = tbox.options.value;" P+ B5 r# j3 c  k5 `
arrtbox = tbox.options.text;$ y( `# p) S% X! _% l
}
+ B- E% u7 F9 _2 h3 l* P1 n" ^3 W' Cvar flength = 0;
4 [- l% I6 B8 W) F$ k; e, E/ Svar tlength = arrtbox.length;$ t7 y5 {8 @+ E" u4 x
for(i = 0; i < fbox.options.length; i++) {
" [7 q; @5 p+ O8 b6 Q% g) Harrlookup[fbox.options.text] = fbox.options.value;
$ m6 J" k$ b- r2 }' mif (fbox.options.selected && fbox.options.value != "") {+ @  y  j' p% _) t3 Y# _
arrtbox[tlength] = fbox.options.text;
5 _" G3 N6 _2 l! ^9 _# qtlength++;
4 t9 x' M, v# m8 c: G}, {$ h3 E  l$ H. Q, l2 g
else {2 _+ ]# [4 |& l* m4 b2 W4 |0 P; _$ G
arrfbox[flength] = fbox.options.text;
' j( \, Y5 ^$ Q. g3 dflength++;
; b& j0 R2 o9 j) z2 q: v  m" m1 {  Q   }! z+ E: I1 E2 @% v
}
1 J, R# b3 t$ Z9 sarrfbox.sort();
* @) u1 |: }$ i6 iarrtbox.sort();
/ c1 a! L1 @. G4 @  h! i4 ~& I  \- A
fbox.length = 0;3 g- B; M+ v- ?# r( Z7 U
tbox.length = 0;
# H4 Q" C9 K9 q7 ]- kvar c;
' p4 @9 x" n* m- f& nfor(c = 0; c < arrfbox.length; c++) {
" B4 ?$ Q, j5 y* n2 T# Qvar no = new option();
4 H  A: S9 q1 F6 kno.value = arrlookup[arrfbox[c]];
, d6 ~+ A7 s3 Q( K" ?2 x8 Tno.text = arrfbox[c];% L& @, u; X6 ^% h, `
fbox[c] = no;
: _' h! p1 j7 K2 J; p7 K9 C}) a7 U# p- Q) Q8 L, v
for(c = 0; c < arrtbox.length; c++) {5 O3 d% b) ^* H: T4 `* v9 _
var no = new option();4 X5 h" x6 D7 b- E; [& a" C
no.value = arrlookup[arrtbox[c]];
3 M0 j' p# {% s2 o# g+ }no.text = arrtbox[c];
- U' v$ ^7 n3 p+ ~8 E/ ~0 p* ]tbox[c] = no;
: r' O' ~* g1 k# W. o& L) @   }- A; p8 Y/ j1 r
}: l# p2 ~1 p% {! v) Z" f
</script>( t/ b3 ?: b( G1 V6 @2 o; P, t7 g1 u
</body>
$ E& \( j* U' W& R+ @4 k+ P& ]





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