Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
9 o- G8 @  h$ i. u; m- [/ A9 z0 a         c pageencoding="gb2312"
( M1 q- a6 l& w% G" E+ _6 H%>  }- |+ l1 B- d3 q: n5 S, o
<style>( t1 m$ p- J* e* u9 f
.f9{ font-size:9pt; }* R4 [/ X4 `) c
.bgc{ background-color:#aecaf9; color: #0033ff }- I1 t' i/ v0 I0 t: h
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
9 k, v8 D. {. A  @+ P0 G  border-bottom: solid 1px #4e7dc1;6 c- c+ _. w" I; D; W# h7 E
  border-left: solid 1px #aecaf9;
1 t$ I) d1 T. J) ~  border-right: solid 1px #5679bd;
0 Q& o' l8 h6 q% a5 l  padding:1px;9 D2 x- b6 [- p
  margin:0px;}! b0 C9 R, f. W% Z+ M& k
</style>! X0 V( P5 Z% k* I
<script language="javascript">% o* a; _2 Q$ m
<!--
# d) ~6 x. y) ]/ @" |- t3 ?' {  cfunction rv()+ k6 {$ F& N! l5 q9 L( z8 T
{) C9 v9 s1 _1 Z0 ~
  var val="";$ `/ U8 }4 \, G7 b: U, D5 A( Y
  for(i=0;i<combo_box.list2.length;i++){! c; S" K% [0 I+ H8 x9 W+ @
   val+=","+combo_box.list2.value;& M6 _2 T0 h( \% c2 t' u+ O, G# ]* `
  }
4 T7 c2 a: L1 B+ S  if(val.charat(0)==","){
1 c9 V: l( I: R/ w1 L4 m   val=val.substr(1,val.length);
3 d3 T1 Q5 u6 w- i2 K  }/ K6 E9 t9 [5 R
  opener.form1.frecname.value=val;  R: j) N( a- N8 }3 v0 G* E
  self.close();3 w* b) i* c' A: d/ L
}
' Z! h4 K) ^. `5 _3 ?1 ?) R//-->
# j# }3 u5 H2 y</script>+ m- c9 q! ?; S- G( A
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">0 o$ J/ Y/ {9 C, {
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
, w- m+ \& p( j<%; O/ B0 R+ P5 S! n4 R
  cdatasource ds=new cdatasource();  //数据联结bean实例; ~: i' U' K9 H6 @
  java.sql.connection conn=ds.getconnection();
$ P' z& z6 ?! z% E  java.sql.statement stmt=null;
8 n6 S0 l" p! B- ^  java.sql.resultset rs=null;
/ k' I6 l" a) |; e, Y  cdatacheck dc=new cdatacheck();/ w, v8 d- p2 @- b8 z) N6 ?7 B; d2 t+ \
%>
6 d1 c: k5 W5 y$ w! j% i) K<%
. Y1 {# x- t7 K! M" X1 tstring 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";7 `# k  B) O, W) U  |# A5 B- b
stmt=conn.createstatement();
5 b, w0 S4 z1 Ers=stmt.executequery(sqlu);
3 j; L# f2 z" g4 M9 o! O5 T3 P%>
9 e1 u1 R: D3 }  [, d<script language='javascript'>" d. Y1 L& t$ J7 {; B
arr = new array();7 w( f9 N7 t5 K$ @  y( |7 Y) t) i% R
<%  int temp=0;
, C* W4 p" u6 U* ~% ]) i* gwhile(rs.next())
9 h" Q5 ^* v/ q# v{
* M# ^0 `# a4 K) B%>
/ E6 |  V, p, ]9 parr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");2 W& {9 o: Y$ d# ^, O2 S; e
<%; d* N0 b$ Y( z0 ?& a( G
temp = temp + 1;
, g. m6 {0 x; q5 N% a7 @( k# J}
6 h, K: x  ]9 k2 o9 n8 T6 f+ I6 R. K%>
# F8 L, X( T& b5 a- \) @) f2 mtemp=<%=temp%>;: Y3 Q- ~) f9 @' u5 {- M! X
function changelocation(id){
) g/ J, z- ~) o" w- sdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
4 g7 h* W' D+ @8 x7 |+ _var i = 0; 6 Y/ K' u0 |' y' a
document.combo_box.city.options[0]=new option('-------',''); ; ]: ?0 i! ?- g7 ]3 ^
for(i=0;i<temp;i++){
+ v0 g% }; h. c; K7 n; Y; h- xif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 3 t2 w% d2 N3 F: [" G
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
, `3 w( B% U  ^1 Z7 J: Z}
2 g3 Q# c* c: ~}
1 T0 A/ G$ W* @6 L: y) l6 x} 0 G' t2 Q' Z0 R( ~: F; t$ b
</script>" Y' u4 Y1 l) p! s
/ }/ ^+ k  b, P. U" {+ A1 q
<form name="combo_box">* u3 o6 W+ B1 y! ^; w' W: K# Q5 p- g
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
& j2 ]# m4 A+ o# `4 K  <tr height="24">
( a: B. U- p( _    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>- C" C6 ^; T$ r9 j. ~6 \
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>0 L7 q/ @% Q& z: }" j* B
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>2 k7 D- _1 |* n/ }7 S* V
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
( ^4 y/ ?$ q7 O& o, @5 g  </tr>1 w/ A: ^: R3 |1 ?; L
  <tr> 6 Y5 c, [6 w  D/ [8 Z0 s
    <td>
8 T8 S9 X1 w: h: A' v' H: g' v  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">0 S6 w, m5 K" _' C- }
  <option value="0">请选择部门 ---></option>
. w, @: e% a3 B9 p7 r<%* s( N, n) p: H9 r
    string sqld="select * from tdept";
: r6 \! ]2 ^6 e8 [7 t1 h7 Jstmt=conn.createstatement();
  t0 |6 D9 U2 k: }- y! Frs=stmt.executequery(sqld);* j; _3 R6 j$ h  ]
while(rs.next())
9 U, M8 N' g; c* V) l$ A{' f3 X5 P+ V* {! k- J# J
%>) [, k$ L- }0 d. n) t
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>: q2 N' G1 f+ J4 V
<%
7 g8 p  L, t: H8 f- e4 K8 I}
/ F. q6 p; ^, l%>
( s6 e. o+ C/ F) h4 c! V1 v  V  </select>
/ W+ _$ n0 X( q) U0 `* ~; x7 C2 `. N</td>
7 ]# d" E3 A' y/ w    <td>
: d: G* j- m% |; D: ?( z  <select multiple id=city style="width:150;height:200" class="bgc">
/ ]0 j! K# ^2 a6 G3 `) j& Q  </select>
+ H. ^# i' Y  k! ~; f" @1 r' r</td>& U! V! ]6 M) m1 D; r
    <td nowrap align="center" class="bgc">
# t4 i2 S8 e" ~  e  <input type="button"  value="<<" class="buttons">/ B8 G2 ^% p) K( c# w. V! D% a
  <input type="button"  value=">>" class="buttons">, }8 l3 D1 E1 ]# G! B; B3 H1 A
</td>, G. N4 V# V# {0 R/ [3 n
    <td>; T" v: B( @$ a) R5 o" ]! T
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">8 ]; Z0 Z# R% l! c
  </select>! h. l4 }; f' K5 ?
</td>/ B: x: q( |: p! a  v$ g/ _
  </tr>
0 d5 L6 O6 I2 f' ?) D5 G* {    <tr class="bgc"> 0 Z; p! a6 }% D5 T, L
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>' I2 B5 w& [9 d8 I) c
  </tr>
/ w& h/ P9 l/ f/ v</table>
& n" z' L' ~7 m3 u</form>$ @( Z, _+ D' o. F2 J5 T7 w* t5 f
<script language="javascript">
/ f# t8 Q5 p7 ~8 O//人名移动
1 H. A/ b3 ^8 [) Y0 j3 d3 {0 bfunction move(fbox, tbox) {
7 i1 V9 m7 E, M0 D3 t) y; O% m  Tvar arrfbox = new array();8 r% [, }+ ^( B% ?0 D& b3 ?
var arrtbox = new array();
# B8 |( V, m3 {: G! a' Ivar arrlookup = new array();
( i# j* a7 _& i7 t2 F2 Jvar i;
* E; @& B7 U  j' Nfor (i = 0; i < tbox.options.length; i++) {
( F- ^" l8 k. Harrlookup[tbox.options.text] = tbox.options.value;! F) {) o, y) V6 R
arrtbox = tbox.options.text;
. ]5 V9 t$ s; g2 ~" Y5 u. W9 F+ |}( R+ G. j, c8 P
var flength = 0;
8 V8 P; w2 t! uvar tlength = arrtbox.length;% A& B' l6 N% {. [
for(i = 0; i < fbox.options.length; i++) {
4 j+ w; I- \9 }2 garrlookup[fbox.options.text] = fbox.options.value;
4 r  k1 i- E5 b  \2 u& D) V/ wif (fbox.options.selected && fbox.options.value != "") {
# s' y- y* ?+ z6 M0 _/ ?' v- d5 C- K) Karrtbox[tlength] = fbox.options.text;, R1 x- l/ f$ j* Y' c# c/ W5 z- I
tlength++;
  N# ^. Z7 w9 k, w7 s+ w}
; N( G; c# K8 {* d0 T  w7 Felse {- m9 l0 H9 n. i: Z6 X" K
arrfbox[flength] = fbox.options.text;
# b0 }/ q6 B; x5 q/ lflength++;( R% Q* G  p; i1 T9 N( e3 H
   }+ `! l( `- O0 t' M( ~# M1 O, w
}! |( b) ~. Z5 N# k2 Y* e1 F
arrfbox.sort();
" n$ I" M2 L+ M7 L. @. P. ~arrtbox.sort();( h% O/ X/ Y% D0 A2 \9 o5 x1 Z3 I# r

4 F* j0 b  C+ \fbox.length = 0;3 M* R4 ~7 `* v
tbox.length = 0;- e# F2 f$ B! ^% }5 T' R; w
var c;
: q8 D3 q+ l: m3 }' kfor(c = 0; c < arrfbox.length; c++) {
4 ~  l( F/ K( j$ e5 Xvar no = new option();
9 v4 Y. J* Q& V* e0 |+ m. |no.value = arrlookup[arrfbox[c]];5 l7 N) J9 s5 ]  [/ h
no.text = arrfbox[c];* F7 o3 h2 q# T/ |& M( B
fbox[c] = no;
6 x* h% N! p* E5 Q, l) f}
8 }0 q% J' y. N; v$ y7 Kfor(c = 0; c < arrtbox.length; c++) {
' ?. o& }+ }% V" r9 ~var no = new option();
7 _. N# B& w0 I+ ~no.value = arrlookup[arrtbox[c]];% B/ G9 b; |/ y
no.text = arrtbox[c];
& k( [: c- t7 n3 \- B& Qtbox[c] = no;& m/ ?( T) ], z7 a
   }
; u+ ~# l8 T1 B' p$ e( o: q}! N) z& _9 n! J+ I! ]2 G3 V
</script># [# f8 [7 @( A& D2 ?8 ?" h. n+ n6 C- k
</body>, k, J0 B  \* ^





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