Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
/ [5 t3 X& H5 ~( ^* G0 B         c pageencoding="gb2312"4 R5 y# N- D9 |  k
%>
9 L6 V9 M; B4 T' G& ^) h+ p3 o<style>+ ]  J3 r# k( N/ N5 k$ x4 O
.f9{ font-size:9pt; }
; d9 \5 o5 A9 N7 `& E.bgc{ background-color:#aecaf9; color: #0033ff }
. ]9 [7 O! p1 q; M3 \2 l.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
, S; G2 ^: b3 s/ e$ _/ `/ W  border-bottom: solid 1px #4e7dc1;
4 M3 `  A+ ^0 F+ z% D" I' ~) h  border-left: solid 1px #aecaf9;8 u4 K1 L- O! V2 ]$ `" C1 v
  border-right: solid 1px #5679bd;7 t: I  N! _7 k+ X/ H- j
  padding:1px;& O, n+ i' t! v  t. j( O
  margin:0px;}+ b" x8 j# o3 Q+ D+ x- r
</style>; j& a) D, [  H" v/ |
<script language="javascript">
+ E1 v; N- |$ x$ ^, f; B  K<!--! _% j. t* X) W( I: g, Q
function rv()# \, L$ w. \" G
{/ G+ J7 }1 a; }
  var val="";
; c9 J# w; D5 m& f! p. w8 b  A0 n6 r  for(i=0;i<combo_box.list2.length;i++){
6 f! \% ~  z% \8 l8 ]: T) W! ^   val+=","+combo_box.list2.value;$ j/ G4 ^: H: z5 j! D' v6 d
  }
/ M( M0 v' i2 m; }  if(val.charat(0)==","){
# ~1 s4 ?; \! a   val=val.substr(1,val.length);
$ R1 Z4 }, b9 s) T* C  }1 U+ ]& m+ U4 u0 \& C( |4 Q3 ~
  opener.form1.frecname.value=val;
! K. L2 R" {5 Q3 U& O6 v4 d  self.close();
4 q/ B% p/ E% G8 d4 j}  i. K& N* t9 F/ q1 u
//-->' E- Z) t4 J6 X! A. a! s2 ^! }- c  s
</script>5 T( H/ S0 Q/ l2 F0 Y8 y+ m
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
9 B6 `; M9 ]( o<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
- ]$ l- K/ R  o$ O  v<%7 m8 _' g2 {% x' ?  V  J4 J% W* S
  cdatasource ds=new cdatasource();  //数据联结bean实例( _5 q2 r; J! v. M" y5 u
  java.sql.connection conn=ds.getconnection();( ?" L, B, B& X, @' r2 e
  java.sql.statement stmt=null;8 ~6 ]$ C/ e9 T
  java.sql.resultset rs=null;
$ \9 r4 c! e) a7 W& t  cdatacheck dc=new cdatacheck();7 f2 G$ w' z$ R% G2 Y" z$ T
%>
- C! m% ]3 w5 m<%- [6 S4 x# n" X1 a* I/ 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";. b2 D7 P# S9 Y# x) e; _0 M# s
stmt=conn.createstatement();
  r/ E/ L+ Z' P* X8 Yrs=stmt.executequery(sqlu);& `' [5 A$ `6 I& I) ^
%>; L( D2 v, \8 ^4 o" D
<script language='javascript'>
( j- g6 p# o7 y) t' z. Larr = new array();
% k  q( w6 b3 b# o7 q- k<%  int temp=0;
6 a8 J) s* K4 n$ ?' i; N& Swhile(rs.next())* O$ t' B; k3 d6 t) |/ [6 l- _% `
{$ |; U; I4 [  _8 {- q& F. P  B0 X
%>5 n0 t/ P) w& u8 E: S" I' x
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");4 `8 k. L8 U/ Q$ _* g
<%) S+ g( c0 g5 o0 b3 F) F' O: S( p
temp = temp + 1;, z; k; Z4 T5 \1 V! H; O
}
! P$ S' b7 J. S5 b%>* n  V! o* H/ U, Y, P
temp=<%=temp%>;
8 u5 i- r$ q) R; m$ R6 u- L# v$ d8 Nfunction changelocation(id){
' V# y$ f5 M$ W' _document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 . m# |( T5 `# r! T- D, g7 g
var i = 0;
# V0 |) `$ F7 Adocument.combo_box.city.options[0]=new option('-------','');
0 z4 ~6 p8 L% p0 T/ @" _for(i=0;i<temp;i++){ " @: B: K7 |0 R$ D9 l: S. A0 \
if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
& @* q6 K1 T8 P+ h: q$ ^  ddocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
9 S# n( v, E% u* j# M; W+ {} % X$ t1 B3 c" ~' k4 ~! X/ X5 ]
}
- [) V3 w) Y9 U+ }1 i}
+ b6 D, o" N8 O, m+ w6 i" p</script>( V4 Q) c" \6 W; Z" \' M' S
# w4 ]  V! b' ~
<form name="combo_box">/ `7 i  g, j- u- W" N. I
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
- a7 n& j$ ]6 \, A$ q  <tr height="24">7 @! u  [; M2 E0 P  j0 Z# A
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
- m- `9 I  y- Y! Q3 }( J" Q! p  W( N    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>6 a. w) g" r: _4 J( Z& ^* f
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
% ^" e3 f3 \3 ]' t3 ]" O    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
1 V! ^; c) }6 _) F8 s/ P  </tr>
8 E; w" k7 T, c) ?  <tr>
3 H1 m9 H- F  d    <td>
) a2 i7 w* W% Z  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
1 `& b' w. Z) e: y  <option value="0">请选择部门 ---></option>
& K  K' O( c3 b% S7 }# w  j<%+ Y4 Z" U$ g# C  k
    string sqld="select * from tdept";
) Y+ u& m. H* U  Z- Bstmt=conn.createstatement();3 V5 B/ _8 @8 z6 E" j; u
rs=stmt.executequery(sqld);
; u! @9 c5 M1 Z2 F1 o2 l8 ]while(rs.next())
+ w# r& e  \3 z- X( A2 n% F{2 D% K0 l/ R9 K! A( Q/ g8 ]9 \
%>
/ O$ w+ Q, M. C3 x4 i& E1 Z  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
/ O5 @" m3 c4 G+ L<%. o' a6 k$ K- k2 J" d; N
}" g, P: @7 U) g2 o# w% a) Z) o
%> $ ~7 v/ D, \& t
  </select>
& ^0 i' a& ~; K6 @2 E) M</td>3 A( ?% x$ B# w; }3 j. s) C' q
    <td>0 ~! Y& _' q& V6 @
  <select multiple id=city style="width:150;height:200" class="bgc">
6 f/ e! w, \; y( @' s  </select>
- x6 Q. U3 B8 M9 [9 I6 _9 y</td>
% y% |+ ~0 G3 G% q! d4 e% x2 F: E( i2 B    <td nowrap align="center" class="bgc">8 o- E' n7 _# P0 R; n
  <input type="button"  value="<<" class="buttons">5 n* l# }' I$ [
  <input type="button"  value=">>" class="buttons">
: B" z$ e9 X1 l, ?9 _</td>
9 D! K7 U: ]8 U+ U; B    <td>% c. v0 z8 z' r5 s
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
) m& ~2 N" Q3 L6 N  </select>
' @/ Z$ Q) h" X</td>$ N0 t8 b( s, I* c* K
  </tr>
8 \$ V# v" Q1 R- }6 g    <tr class="bgc"> 1 e+ F8 P$ {, d* X
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>& B, r$ `. i: g5 K( q0 S. s1 ]
  </tr>
$ j) g2 c4 I5 s% v% Z</table>
1 H- W* Z1 x1 u' Z* m! r5 G- G  i</form>
! C) X, L3 ]! b+ N$ A3 c2 j<script language="javascript">
5 _2 k9 F( M/ l0 q% j//人名移动
- j3 _  D0 t) z: d9 [$ Jfunction move(fbox, tbox) {
& s. C6 t+ M1 ?: J! ~9 U. o% C/ `var arrfbox = new array();4 L1 ~& @) f2 C# x( ]) {7 O2 F
var arrtbox = new array();% Q9 R. ^; e5 a
var arrlookup = new array();
7 B# l' ~, i3 S( uvar i;
% y% l: \& t2 ]# q/ `* @for (i = 0; i < tbox.options.length; i++) {* h- l. J( D% {/ ?1 _2 W
arrlookup[tbox.options.text] = tbox.options.value;
) S5 \/ ?7 e% O- B; parrtbox = tbox.options.text;7 `1 P! W: ?3 l1 Z
}0 Y5 \& A$ b8 a1 S0 r# R4 S/ Z' G/ ~% N
var flength = 0;! B- \- [. t* b2 H+ P+ |
var tlength = arrtbox.length;, [. f4 n) Z) \( @+ g; m
for(i = 0; i < fbox.options.length; i++) {3 ~7 q( X# \0 }
arrlookup[fbox.options.text] = fbox.options.value;; `7 I  v% b2 _2 R  v1 a
if (fbox.options.selected && fbox.options.value != "") {
6 ^1 R* P" Q6 U) {, B0 o% r) parrtbox[tlength] = fbox.options.text;
# r$ b& q2 I9 Ptlength++;/ d9 _, F* y8 j8 ^- @9 ~
}
1 q1 ^: l8 F0 |1 o0 Xelse {* O- V* g7 V/ {4 _4 N7 z' w/ e
arrfbox[flength] = fbox.options.text;' p9 ?$ ^# Y& V* F' e, s$ I$ |
flength++;: M2 D" n) ?, s, y3 m- T
   }
1 O1 x8 G& S4 q+ k}/ N$ s1 `3 l1 U7 [0 t1 V
arrfbox.sort();6 P# E* _* r" ?8 K
arrtbox.sort();
  t3 p. s. p; P+ t: @  s+ `3 ]# e  O8 G% S4 ^$ R/ U$ p' e% s
fbox.length = 0;4 o& y8 ]) q  ?4 B& L
tbox.length = 0;
" }* |% A$ N' a0 ~4 o" ~1 b8 xvar c;" q( z5 Q! E5 }
for(c = 0; c < arrfbox.length; c++) {
8 {# [& s/ ]. F+ svar no = new option();" j* @, k1 k" ?# X6 X
no.value = arrlookup[arrfbox[c]];2 ]& E- ~* q, w) W
no.text = arrfbox[c];4 w5 ?+ Q. @/ _; t1 j6 Z' m
fbox[c] = no;
1 z8 i- h* z( Z6 v6 L}# p0 d3 z( s7 v: n9 A% E, ?
for(c = 0; c < arrtbox.length; c++) {
+ ~; h# n. _& C: W6 hvar no = new option();
( ^! g# C' P) u  ]2 [' ?* H2 mno.value = arrlookup[arrtbox[c]];
; T1 R2 w: R* Y2 Ono.text = arrtbox[c];' ?! n0 s4 U1 n# x! s3 Y8 C
tbox[c] = no;
* c4 X1 I; j( A4 |+ Q* |   }( B8 v4 g4 {( F$ L7 M' U+ A
}
4 {/ P- b" G! c6 O# D0 Z# l, r</script>
8 q4 h% `! w+ i/ j# x</body>6 M5 ?4 f: U8 D9 S# _0 r





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