Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"9 e7 l4 s/ o( `8 T6 b# o
         c pageencoding="gb2312"
; c* ?7 Q6 y3 ~! m/ f%>
* [& O/ i/ P; W0 J: a0 f<style>
- U5 V! Y8 k& m( u6 K9 J2 S.f9{ font-size:9pt; }
7 K& u" O) E/ [5 U" h9 d.bgc{ background-color:#aecaf9; color: #0033ff }
9 A3 I( r/ W5 U: X, D' L4 R" ]- z.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;+ o  M8 Z% z5 }" h9 L
  border-bottom: solid 1px #4e7dc1;: F) z( I# H! o- f, N
  border-left: solid 1px #aecaf9;
! S) `8 ?0 W% ]8 C* t2 q  Q- r  border-right: solid 1px #5679bd;
9 L; h1 y; [6 t7 ?  padding:1px;
5 @* D" y1 C/ x: j" w' ~) }: S8 `  margin:0px;}6 Q; Y# ^4 V; U; d1 U$ U2 E, T4 _
</style>
+ W2 z; `4 d3 m4 }<script language="javascript">' L5 Z* F" j# v' b, ^: I  i* ?
<!--* x: R: g; ~1 x9 f
function rv()/ f( T) l0 `9 D4 b& k( O
{
$ ~  \+ h3 H9 d0 J  var val="";. m2 M, ?% v5 c' o0 P! R5 b
  for(i=0;i<combo_box.list2.length;i++){
2 I8 V& ]! V( C/ s   val+=","+combo_box.list2.value;
! A" b( T0 Z1 k$ Z/ Q# Q2 J$ `, F2 F  }4 y, [, H" H3 O. V9 x
  if(val.charat(0)==","){
/ y  ]* ?4 m& d: o. T   val=val.substr(1,val.length);+ y; p" l2 d0 ^6 S! C7 s+ x4 ~
  }- b" n9 @/ t3 s; q
  opener.form1.frecname.value=val;
1 G( R, v& \! W' |7 l( t8 m. m  self.close();
/ G1 [! j5 x6 @7 A. u6 x( L}9 A& R0 H& X; [3 m; U
//-->
  @3 ^6 I; c* l) V3 S; k. K0 D( M' i</script>( e5 p1 u; W$ |* D0 T
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
3 Y2 m' }: K9 x/ V3 k9 j<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
2 F7 H: @9 ^/ C+ h5 |. {% R<%
6 ?5 j6 u7 n  b) F  ^3 s% o$ L& u  cdatasource ds=new cdatasource();  //数据联结bean实例
7 V. K/ Z+ T6 P( \9 f' X) D  java.sql.connection conn=ds.getconnection();9 L9 A3 ^- t4 h+ ^( G; A: h& {
  java.sql.statement stmt=null;
3 d: z- r" Q- B  java.sql.resultset rs=null;
& ?" h) v* o, \6 j4 K  cdatacheck dc=new cdatacheck();
+ |& y. }" b1 N) O" k( m%>, e7 Y6 M. N$ x' t" o+ a( |6 ~8 i5 M1 V
<%
& b7 j) D& h2 C: A" n' }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";# x; e0 d; c9 a
stmt=conn.createstatement();
! q5 c3 c% X# |2 {9 n8 m7 crs=stmt.executequery(sqlu);1 D' c% ?5 J7 H3 d/ H, Y) C
%>
2 V& w" v' N$ K7 H% u, a1 G<script language='javascript'>
* x6 r2 B9 w* ~# D6 k7 R3 iarr = new array();+ \- q7 T6 K) i& L
<%  int temp=0;* L5 C0 ]  ~4 ^" ]0 E
while(rs.next())) F& o- W% d* {5 x
{" g; c3 P9 w( Q+ }6 j1 I2 ~9 E
%>9 b4 i. t5 ]! k8 T
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
  s9 t- z( q: B8 r8 s<%
- y+ Y3 u( c! J3 P' i- Mtemp = temp + 1;8 y1 e* v7 c2 u7 N7 s* n/ I
}3 R4 M2 R) T# o- {
%>/ _6 H3 W* Y0 ^) b
temp=<%=temp%>;
1 ]# _( d7 T8 R3 J  N3 ?1 _function changelocation(id){
, s$ a( {0 p5 d4 D9 wdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
# m, Z* U6 _' s& N) h; o- Vvar i = 0;
3 x9 |9 R5 e2 ], e6 U. J3 T1 ^: Ydocument.combo_box.city.options[0]=new option('-------',''); # q# Q9 S. T* n- \+ ~2 D# z7 H
for(i=0;i<temp;i++){
6 l$ ?! n# e3 }! U2 }& aif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 9 u7 u3 D7 r' v1 [4 U+ `
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
7 o+ Y1 G2 b. a# g" a, L}
9 o3 n0 U2 i2 S$ }  J, ]}
. }: x. j4 `( [}
2 M2 d* [% K4 ]5 d8 z. T" q</script># q2 p3 j& M0 f6 U4 I1 w& c
3 R! P2 r4 }4 x5 ]9 Y0 `
<form name="combo_box">
( K* h, |  C1 y. u7 p<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
, W! T3 f+ _; L+ W- w% \  h  <tr height="24">8 C1 M3 C. x( i2 H
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>. X, o8 `2 Z$ W
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>- l- S: J$ {! I1 f( N
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>) ^6 d5 H$ E: b& u4 L& L- J
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>: g4 U8 [3 o7 O' P& N1 W& z3 A% |
  </tr>
( Y; f( i. ?- f- g4 _2 r  <tr> : S1 F1 k; C; t! `8 y9 X
    <td>
6 J8 M/ r9 P1 f' t0 m1 x  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">" i( [9 s- `! M$ c  x
  <option value="0">请选择部门 ---></option>/ _. l( B7 x% q4 k8 |
<%
% I3 k5 [  |( D    string sqld="select * from tdept";" l$ B3 a2 h! `7 a
stmt=conn.createstatement();5 |& b* [3 B' `8 D3 Z
rs=stmt.executequery(sqld);
. q" `$ C/ d! K1 q4 ^while(rs.next())
8 C( i$ x  V9 U5 f" ?- ~( P' P( Q& i{
9 ^* _" {0 V" d& b# L3 x5 B%>
- L3 C8 j# K) \+ U  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>4 o) b3 p& }% b2 r
<%& ?* @& R4 p$ i; o
}" P/ W8 r, Z; p1 r
%>
' G2 ]! o+ C% W( m1 j1 Q* w4 z  </select>
* S* G2 Y9 h6 @( e+ S% m  h2 [</td>
7 a. Y3 ^. r6 y" J0 B    <td>/ e# g3 r- Z2 r* D, |: K- F+ y3 O. c
  <select multiple id=city style="width:150;height:200" class="bgc">: }& T* ]4 m2 G9 ~/ f
  </select>; C% s4 [) y5 d
</td>
* a% C+ t; {% _% a. R    <td nowrap align="center" class="bgc">
- U, n' z. W0 v8 |2 g  <input type="button"  value="<<" class="buttons">; P8 a5 x5 V, C/ Y
  <input type="button"  value=">>" class="buttons">
3 q: ]! l' m9 T</td>4 V$ u" j7 p* L& X
    <td>1 |0 Q+ }$ N  z* k( `1 M. i6 c
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
7 V8 m4 d4 c, \" `7 O! c  </select>
8 p- x. ?+ J5 @1 |! p</td>3 Y7 t& A  m0 R- S" a
  </tr>( P1 N. [% c+ ~* {  r7 N2 T# ]5 e% R
    <tr class="bgc">
9 A& l6 y& g  b* J( P/ r5 f5 A, ?    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
0 g( D) ?5 [4 C$ r6 X5 h3 z. N& f  </tr>0 J2 q  b  |' P  m
</table>
! V. z- w7 d1 O: F) y</form>
* Q/ ]7 O- k9 L0 K. r" ~! X0 Y( h<script language="javascript">; ?5 ^0 |& a( R! X& k7 V' R
//人名移动8 C/ i; a/ Q2 [1 ~  g
function move(fbox, tbox) {1 C; Q: R+ A* ~! V  F
var arrfbox = new array();( X$ j2 n* a6 i9 o' ^+ |  c
var arrtbox = new array();
2 H: N8 s9 Z$ Y$ \' p4 }var arrlookup = new array();
% O$ ~# D- E  F0 `  L) S/ g7 Z) lvar i;
. J; K8 T9 n& M, w/ ~2 Tfor (i = 0; i < tbox.options.length; i++) {! ~2 D& p5 k8 G
arrlookup[tbox.options.text] = tbox.options.value;
. t: z* o" P9 b* karrtbox = tbox.options.text;
0 q4 B9 d& w% m; E6 q: O}
& |4 w9 K. o/ m. b7 x7 X& ]9 wvar flength = 0;
; x5 i# E  C# y* N7 S* W+ [var tlength = arrtbox.length;% A5 W: N0 s  O# J% h1 b1 Z
for(i = 0; i < fbox.options.length; i++) {
) n4 p5 K4 G/ B6 A  D8 d2 H8 darrlookup[fbox.options.text] = fbox.options.value;0 `. [" M: m/ a$ `2 [  B  ]/ [5 M
if (fbox.options.selected && fbox.options.value != "") {
" d# L' [+ E6 p7 [. G! G) Parrtbox[tlength] = fbox.options.text;
% j6 M6 W' z: G8 P  ltlength++;4 z! F8 I% Z0 Y3 f2 N
}7 p; I0 ~5 r- b6 p4 D
else {; P. Y8 ?7 a* }) a4 s
arrfbox[flength] = fbox.options.text;
3 ^! S* T2 Z7 I) F  Yflength++;
# P* m7 q" B/ l   }! X. n  Z1 n$ g  {: t% p
}
. Q% H" V1 t$ uarrfbox.sort();
$ c$ J0 g4 E) ]8 ^7 m6 B1 R$ _arrtbox.sort();8 T+ j9 b9 b/ h3 c( x: H
: F, |# @2 |1 A; k- q% V
fbox.length = 0;
/ l( r& j  [( h' u4 |5 P- }tbox.length = 0;. ^! V  |' R2 F7 I7 \* k
var c;+ s4 V; [6 g0 _$ Q% g* D
for(c = 0; c < arrfbox.length; c++) {, `2 W: @+ W7 C6 r  i0 q. N
var no = new option();
: d- R3 M( E* y0 M7 b( b9 m- F$ g& uno.value = arrlookup[arrfbox[c]];
7 R6 D) m1 v6 C5 n$ Yno.text = arrfbox[c];* U. O1 q* w1 `: N& m
fbox[c] = no;; [6 D6 r0 r9 Y4 x& V9 q2 ~
}
- d" H& n6 {0 [- b; r* nfor(c = 0; c < arrtbox.length; c++) {
* `& v) I3 y; |# h7 jvar no = new option();
2 j# V, b/ n% a7 bno.value = arrlookup[arrtbox[c]];: C3 |/ g) J. t: V9 @' ~
no.text = arrtbox[c];& _' ~3 f5 ]7 z
tbox[c] = no;
. l" v' k( S% D! t3 j   }' X! y0 Q" b- V! p
}
7 j# V6 Z0 J8 C! l+ H" \</script>0 @- b" n+ a: T2 a8 ]6 p8 p
</body>
# c8 l/ C+ g  Z





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