Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"# {! S4 }; \  o. Q6 w7 L
         c pageencoding="gb2312"( {* q, n% L3 w1 c# _& p% ~( W
%>
2 f* x2 @1 x- u<style>
8 d" S% A) x" E.f9{ font-size:9pt; }
8 H, F. ~7 S* Q7 d- |9 z: C  f: D8 _, A.bgc{ background-color:#aecaf9; color: #0033ff }
. o- `1 M4 ~$ e# o5 B; e, O  s5 B9 ].buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
! U$ _$ A3 I1 T1 t  border-bottom: solid 1px #4e7dc1;. ]: k+ I3 h; }' u
  border-left: solid 1px #aecaf9;
0 M3 D- r$ r1 P. x4 h7 Q/ U' N  border-right: solid 1px #5679bd;6 {+ v+ g! N. |1 g3 T1 L- [
  padding:1px;" L/ u4 f; q1 @8 @
  margin:0px;}
, u& U' [; i' }! H; D1 M</style>( X+ T) t  B: R
<script language="javascript">
7 R. n7 \( t0 P) Z' E1 {8 D! C<!--
# |" i: T& _: `function rv()
) @2 m9 x4 S0 R1 D{
# m. x8 S9 I, y  V3 `  var val="";- m2 n, K& u0 C/ O% P# j- ^
  for(i=0;i<combo_box.list2.length;i++){1 U6 U" W7 u/ M1 e+ Z- K4 c- S& S& U. o
   val+=","+combo_box.list2.value;* w$ j' D$ q* k/ E' o7 Y
  }" [' G8 N5 k: G  u/ f
  if(val.charat(0)==","){* Q7 B7 N. F( t- }& l
   val=val.substr(1,val.length);1 u3 W! v% A+ a( F! `, R% C
  }. B" P" I9 S" B3 A. a% H0 T
  opener.form1.frecname.value=val;
7 }7 |( D( [9 s" L* T7 L  self.close();6 m; u4 I/ S, R- ^1 H) h; w
}, q; W' }4 k3 e) M0 y8 Y
//-->
6 v5 c# A; h9 c) H* f</script>
6 X( i0 N3 q' n* x<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">7 z8 L9 _( Y4 h$ {
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
0 d( [6 @% n+ b+ Z; E6 p9 e3 w) @<%4 J+ V/ z# a$ P* j2 y& l
  cdatasource ds=new cdatasource();  //数据联结bean实例1 Y/ Q, e% k) D) w
  java.sql.connection conn=ds.getconnection();. t8 o/ Z( y4 w6 o; B: G
  java.sql.statement stmt=null;  s6 u9 l+ a1 J
  java.sql.resultset rs=null;! H/ h! A. E. e0 w: q1 [# w  U
  cdatacheck dc=new cdatacheck();
8 [5 m# t1 f# W( [%>$ q7 [6 Z7 Y+ P
<%" V& j  K! \$ o7 Q+ X
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 d- m, \- G) H& @) R4 X- mstmt=conn.createstatement();
5 J  Z2 L7 i# ^, z! R# e: T+ \- ^rs=stmt.executequery(sqlu);
; B  }, f9 I: @) \* a& r5 Q. e% [%>
- I6 u4 [) `9 y( }$ t<script language='javascript'>) ^$ {4 k" J7 G0 I+ e
arr = new array();( G7 y! j# p0 x! h1 a* ~
<%  int temp=0;9 Q$ t, E/ o$ s2 \, W
while(rs.next())
. t# A, @5 t/ Q5 w( \{
) g/ a; O8 d# }0 W" y( W; H%>
$ u  Z2 G# a4 x/ i$ varr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");, e: s5 g1 P% U+ E
<%
3 d0 `; o; Q1 A8 U7 Itemp = temp + 1;9 L/ [' c8 F" F  C3 W4 h
}) T7 I" x8 y' v- w4 `
%>3 W5 i9 F+ O7 u: P' t8 Y' Y
temp=<%=temp%>;1 z% h8 M/ ?4 r1 M5 ?
function changelocation(id){ * V3 I: g& \0 B, p5 X" D( y
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
) o- K, d* ]& Vvar i = 0; , A( }0 k4 W3 G9 m
document.combo_box.city.options[0]=new option('-------','');
6 _) P* Z, ]% R; e6 U' F- h# S% ofor(i=0;i<temp;i++){ 7 A% t+ `6 g. o' L
if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
# Y- E# p( }: y# A6 Z7 w* Wdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
3 o7 F) m1 j5 u9 q( K3 P. s}
. D1 G) s0 y% ?+ `. \}
* z8 p1 }) N+ ~( A} 7 I& `- W1 n& k: W9 J8 V/ V
</script>
, P4 Z; D& V; e/ F: _% b* O5 P: ^% \+ t/ S  o- s. }6 d
<form name="combo_box">
1 J, ^: _. ?/ ]8 ~! ?<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
# X) A  u! E3 q1 u& g  <tr height="24">/ s; g/ h2 d+ N, U! c* I& I" v$ Z
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
3 R0 {* n, s4 A/ [    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>% s/ O5 L7 M7 n, M
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
4 N( d" L  _/ X& c+ X9 P    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
" ^- v1 c' N& w  _/ b, A  </tr>
3 z  {- M8 }0 J* D% R  l9 k  <tr> # Z* ?- Y) ]6 X6 s4 O4 z$ m
    <td>6 ?% [* W6 s, I+ Z+ w9 g
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
' z9 X; \" u* J% J  M. J' c  <option value="0">请选择部门 ---></option>! c3 d% f) d0 }
<%4 a' F2 w0 v. f" G
    string sqld="select * from tdept";# M1 F3 y4 y9 i9 T
stmt=conn.createstatement();
0 e' Y0 N4 c" ?4 W8 Lrs=stmt.executequery(sqld);
9 j% o% g4 Q: g0 c, {+ m, T$ Dwhile(rs.next())
/ |; ?& o' U, x6 r, f; V3 M1 W' Y8 ^{! ^" s1 Y) |0 a) a, _& Z
%>" u' S; f5 H: r% _, H+ u
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
8 L9 x* {) g& K* c<%
$ L/ `$ t) G' {) Y}6 a: B* U$ b0 C4 W: u
%> 4 i+ t7 w. o6 C
  </select>
  ^' c" h3 ~0 G1 O# ~) z</td>
- m* W3 F3 s, @* f, A0 I+ q) z    <td>; h  |4 @$ T4 A  `1 p9 y
  <select multiple id=city style="width:150;height:200" class="bgc">' _% @) ]0 X+ v! q
  </select>
2 |( m. s7 R0 l0 K$ Y7 W( v</td># I! D& h& a( i: w
    <td nowrap align="center" class="bgc">  D+ \* n& @# a# i' b) m: _
  <input type="button"  value="<<" class="buttons">
& I6 g9 C1 {* b  <input type="button"  value=">>" class="buttons">
7 {8 ~! s- Z9 i1 g# y- r</td>' `# h: G* q6 S1 i, H
    <td>% z2 A+ t! C, R0 v7 _0 x+ y
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
2 G# i6 Y3 l) D% O' q; B" B' x, u  </select>
7 ?! f% E. g) D" r& z% w1 ^6 V( `</td>
5 i6 F( F- z! z5 z3 R  </tr>
; W& Q2 Z" u& O4 E    <tr class="bgc">
% F. C% G( g& v( O* e* ^5 }, `0 j    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
3 @2 h4 @: M5 l6 O! r  </tr>  m4 D8 [( V; B* t7 P
</table>
& B6 |& x' _" N7 W5 v+ J</form>
' B2 ~3 C- Z$ q9 X; p<script language="javascript">
+ M5 y6 j  e8 h8 P5 U//人名移动  v2 K2 q$ W+ y7 X- f' E
function move(fbox, tbox) {/ L5 [' O' C  r+ o$ S
var arrfbox = new array();- O1 ^1 I( F. N" l! v! A* x
var arrtbox = new array();
' s& S/ ]1 z% ~) \var arrlookup = new array();
+ l8 ?4 o, v6 Q; O3 l) [  Kvar i;8 r) z: X9 N. F4 w) x
for (i = 0; i < tbox.options.length; i++) {( e4 z" W- K8 y6 t  O3 P
arrlookup[tbox.options.text] = tbox.options.value;
( B& O& {3 i. x, ~- Earrtbox = tbox.options.text;
: x0 ]0 \+ t7 Q* F% s+ y6 d}
2 p: Q; o. p4 t% `, J$ svar flength = 0;: ?: P4 m1 T& ^2 W
var tlength = arrtbox.length;3 l4 _/ b7 }+ _* Z2 R
for(i = 0; i < fbox.options.length; i++) {: E8 |' V% A+ }0 d9 l" _
arrlookup[fbox.options.text] = fbox.options.value;; D6 i% l0 L8 x8 _
if (fbox.options.selected && fbox.options.value != "") {
7 M3 s; m. h. `) N# z. ~9 W1 j" ]arrtbox[tlength] = fbox.options.text;
1 |2 j+ R5 O5 K' I! Utlength++;( e+ ?& @0 ?5 J7 c2 A2 R
}
; o. ~- p3 O/ g% V5 m( z8 Pelse {/ F7 \$ W3 g$ {( `' ]
arrfbox[flength] = fbox.options.text;
- a2 S  I4 d3 Q3 [5 [) D1 [' O4 jflength++;6 F# G4 c4 N  V% E/ s9 F
   }
- W* w+ M$ y" P2 u: x- O# X$ X5 s}  t; r+ R, u7 V; k# g: W
arrfbox.sort();
6 V9 N/ b! ]' ]6 |arrtbox.sort();' X" r( z0 H  D/ o- J+ U" r( h
( H5 y, g7 X4 [8 f8 L) ?9 a
fbox.length = 0;
3 z: Y! `; V+ q! G9 m) D5 ?0 Stbox.length = 0;1 U- W  T, ^9 Z3 ^# f1 a
var c;
  h" R; I' c; h/ f/ gfor(c = 0; c < arrfbox.length; c++) {
; m) R" x* l5 g% a, A. F. U4 Lvar no = new option();( ?% \1 e' U7 T0 g
no.value = arrlookup[arrfbox[c]];
! k( D& D  J- }& i5 Q  Jno.text = arrfbox[c];! r' a; \) M8 ?/ n: r$ A5 H% ^
fbox[c] = no;
5 ?& w; F7 f2 D, R# o}& E6 w1 e3 h1 A! }0 `- B7 [% B& j
for(c = 0; c < arrtbox.length; c++) {
. L8 _4 H! r+ wvar no = new option();
" k. O: K  u% hno.value = arrlookup[arrtbox[c]];
- ?! V3 c% W; n& I  b+ lno.text = arrtbox[c];, N0 x  A2 h: }7 C( p& X
tbox[c] = no;
' B( [1 e6 y) S   }
- O  N+ s+ [& }: `3 T+ E3 ~}
  a: ?" d* p: n% S- {  J</script># z- i! T+ J! |9 O6 U
</body>0 E+ n; T" ^# F. @) y9 o8 P/ B. Q" M





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