jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"/ J# k% D% T: h! J% L- k/ i: x
      c pageencoding="gb2312"1 }# y' |( c* p
%>
<style>( ]3 q  _" d1 i: q! K  t, m
.f9{ font-size:9pt; }
.bgc{ background-color:#aecaf9; color: #0033ff }
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;. W  h5 b- z& W( O& C7 ]
  padding:1px;5 D7 ]9 z5 k3 B1 I
  margin:0px;}
</style>
<script language="javascript">
2 d  |0 _8 C- e
</script>% p7 v& M5 ^) _% T8 Y' D  C
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
" ~/ |  ^/ e& q  D& t8 A<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
7 u+ P, u; Q# ~3 L( h% a/ Q3 y<%
- s, B$ Y7 W( ~* Y. i1 S  cdatasource ds=new cdatasource();  //数据联结bean实例
! |8 O- K2 ^/ t2 o, B% |  java.sql.connection conn=ds.getconnection();5 B& ~9 A) [# t9 w0 X( d( y/ ]2 r
  java.sql.statement stmt=null;
1 G7 Y. D3 s; K6 w+ e  java.sql.resultset rs=null;
* D+ _7 W% U/ K( Q  cdatacheck dc=new cdatacheck();
; H0 o- I; n9 [* {$ t9 [( ?6 l' @%>
. C4 j4 ~7 L+ ~7 p4 n<%
# q) M. S7 h5 _8 h6 v' ?! x4 n/ p  wstring 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";
6 p1 \0 A9 p0 f9 N; l( H6 Lstmt=conn.createstatement();8 \3 V" ]& I- ]8 Z! k5 k2 d9 G' p
rs=stmt.executequery(sqlu);
. w, ?2 t9 q. E9 b' X6 e. g, H%>
2 ^! j/ z% K  ^" p* P; o# p<script language='javascript'>( t7 V# W' M9 F3 ]/ a! j3 }% T
arr = new array();
& L) H5 r7 D6 B6 l" x<%  int temp=0;+ [7 t7 B, F9 B3 U
while(rs.next())4 Y; n0 L" O4 L# t; O9 }
{& t2 c2 E* z! J0 ~/ Z* Q
%>6 ]& _& a) f0 i5 Z
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");7 x! R" d$ d- w7 B. \- ^' N- J5 p3 G
<%
" N; B7 I" [0 g$ ]+ Y0 btemp = temp + 1;+ t+ F1 P+ M! s
}, n5 I9 @% V2 ]% R7 f+ Z
%>
; O# H+ m+ ]- h1 E& Ctemp=<%=temp%>;
; j; Z6 q: t7 T  |: ufunction changelocation(id){
! m2 K; I4 |+ bdocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始 - w. O6 N# a9 ], m& t0 A$ Y2 A8 v
var i = 0;
5 z$ D2 ~6 }5 N- x6 a3 K$ Z" odocument.combo_box.city.options[0]=new option('-------',''); 5 X7 J' j. ~7 ]6 ?! d
for(i=0;i<temp;i++){
& I! e- w5 k% S2 r. xif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] " a+ @1 T0 Z0 T8 X" |% U/ @% l" b
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); 2 W9 Y, c8 a4 ^  Q, N8 l( A2 R' B- g
}
# [' j, u5 \' M! f7 r5 |}
! m/ Y" |  R7 @" s; M* f} 9 o  T+ k6 E( [
</script>$ E; A: ]+ w( B5 ]
$ j  _/ o- m' G
<form name="combo_box">7 }" g2 F' e5 k; q& K5 C' h3 b9 t
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
( u( R, Q& T3 l7 }( K+ Y7 M* S  <tr height="24">: o9 o( P2 }! [
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>* K" x& t, \( p7 f7 {5 l
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
9 r/ ]8 }# W  _  N5 [ <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
1 J" w$ l- h6 t0 Q* V <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>9 B1 J. y) V) e9 G5 ?8 b0 o  t/ h7 r
  </tr>
+ N1 M- l3 {6 l4 ^5 P/ z, ^  <tr> ' Y  L# A3 j* G! l' d/ ?6 H5 ~
<td>; N' s; p2 y5 `3 z
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">% q1 X  m4 l1 t6 d: W6 g8 Q1 ?- R, B
  <option value="0">请选择部门 ---></option>
, y# |1 T! e! W& A# S, |<%
5 D( `6 Q( T  q1 N4 i/ ]9 P$ r string sqld="select * from tdept";- [  ]7 e& `3 w1 U2 t
stmt=conn.createstatement();
( [" Z/ W; W( U; @6 t7 @( zrs=stmt.executequery(sqld);
) m! A+ a. B$ m7 owhile(rs.next())  M) y2 R( u! [0 y5 g/ U$ \& B* Y8 U$ M
{
; h( u: }2 s8 v: h! C3 R: u* L$ M%>
8 t+ L$ y$ C3 f" {  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>5 u8 [3 k% f$ v' v
<%
- l/ y5 j& P; p$ g. J}2 N( g, x! z# c4 g6 S  [6 \
%>
& e+ V, ^5 ?' H! _) G% M  </select>
% x- m2 g6 i( g</td>
" O; v4 ^/ @. d5 r1 t# o* S <td>
  <select multiple id=city style="width:150;height:200" class="bgc">( `8 `6 k9 c: c% ?
  </select>3 C3 U. [, ?9 c5 k$ K
</td>( c- ]' h# \- o" b' t' j: A
<td nowrap align="center" class="bgc">0 u; X7 o. I9 R( D9 N/ `' P, l
  <input type="button"  value="<<" class="buttons">
$ X) r3 ]! P: e! s$ E& D- Y9 D7 G  <input type="button"  value=">>" class="buttons">2 K3 Q$ k7 i; c3 ^- [& c0 y
</td>
, Q, d: R, A+ t- v8 Q7 T <td>/ l! k( u" z3 J* D
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
5 ]8 W# H; ]+ W6 i8 b  </select>
0 \9 A% _$ B6 R</td># E$ T+ |9 R" V' v' q9 i; u9 z
  </tr>
/ w2 Z8 ^# X& q8 N <tr class="bgc">
% }# j8 P7 @+ Y6 _7 x* K0 R <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
; d( \( D# A  v0 [7 L  </tr>
, q6 r8 P+ Y" i$ L2 u) o</table>- A4 [2 f- B& U. b7 D  Y, G6 t- M
</form>
' J* j/ \4 A$ v7 E, ~<script language="javascript">/ e8 ?# S& l' U6 [) |
//人名移动
/ \6 g9 O) I  l0 C( V- N0 efunction move(fbox, tbox) {1 ^: w$ G- R1 w, A) q3 a
var arrfbox = new array();9 `% Z& J' p( J& |
var arrtbox = new array();$ W) u( S3 v6 P5 R. q8 x
var arrlookup = new array();
- k8 K! k) U% d& {var i;
/ l" V, D& J2 ~* Hfor (i = 0; i < tbox.options.length; i++) {
1 x5 x  ~3 f3 V% y1 d- F( Z) \arrlookup[tbox.options.text] = tbox.options.value;+ H" ^; q3 A' u& W; e
arrtbox = tbox.options.text;% Q; |' w8 t+ _# v" u
}$ s* H; P; o& i& Z
var flength = 0;
. c2 R  u3 K8 ?3 t. @: F  pvar tlength = arrtbox.length;) H; [9 S' M- L5 e# c# u) a
for(i = 0; i < fbox.options.length; i++) {
" E" e8 y/ J1 karrlookup[fbox.options.text] = fbox.options.value;
0 X) u% J9 m* @/ d' v" ~if (fbox.options.selected && fbox.options.value != "") {  g5 A" M# X* W) g6 a: G
arrtbox[tlength] = fbox.options.text;
% n* y' q9 f1 o6 }: ]" [tlength++;5 O. l2 m/ v, x" r. s
}
- n" V& |; Y0 W6 x% ^else {
6 I  [6 X5 _( ]9 c; Zarrfbox[flength] = fbox.options.text;' s4 _7 w" {' t6 U3 P
flength++;
" J& I8 e  Y8 v }4 t. W+ f3 z. u: z
}7 }. w, e" b6 j8 T, Q  q
arrfbox.sort();
+ b1 i3 s. d1 f2 w+ J0 a4 H- \arrtbox.sort();; }  H4 e( {+ Z3 {9 G! ~9 T
0 P, W* Z  b9 s! B7 ?
fbox.length = 0;
* ], ?+ z: m) V' e! `9 p+ y, Ztbox.length = 0;5 U2 F/ X4 v7 }% ^2 e1 i' m
var c;
: H* k* b2 G/ Z' M* @9 y. Mfor(c = 0; c < arrfbox.length; c++) {. T3 h) ]1 F- P- l
var no = new option();
) X& ^# z  N" G0 B6 V  K+ J: N6 Fno.value = arrlookup[arrfbox[c]];' l6 w! s  j' w* |, t1 p; T
no.text = arrfbox[c];9 |3 [: ?2 {& \1 [" i( \0 W
fbox[c] = no;
* [7 @$ U$ b* c: E% Z; S- l" f$ x# u}; @3 G+ r% b' r0 `8 h0 J& S
for(c = 0; c < arrtbox.length; c++) {8 P# E9 v  m5 c3 [/ y
var no = new option();
7 g1 I6 D* \. S0 `: X& p% }no.value = arrlookup[arrtbox[c]];) K0 q- L7 D8 q3 `9 a
no.text = arrtbox[c];
# T" G/ B& x4 Y  {tbox[c] = no;
* L% ]$ F) {) o& O6 n- V( Z }8 y3 k! h. \7 D8 e+ P
}
, Z1 v  |7 n  B</script>4 k' S) G# g0 H8 B) |
</body>( n9 \# x; L( L4 F) I+ E( |

捌玖网络 89w.org----致力于站长学习交流

返回列表

jsp+javascript打造级连菜单

[收藏此主题] [关注此主题的新回复]

[通过 QQ、MSN 分享给朋友]