jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"; R# d' g( C+ |; D" _
      c pageencoding="gb2312"
%>
<style>2 ~1 O' b; [0 e6 s' j* ]
.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;. V' Z7 y4 \! B/ I" D8 [
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;* |; W, m. R3 f4 s5 c- |; Z: [# ^
  padding:1px;
  margin:0px;}
</style>
<script language="javascript"># k3 I  q. p& l* l

7 A% _2 h+ y8 X  d! }</script># {+ g; Y+ G" r7 {+ k' d' u$ ]6 X" v
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
% c+ h; n# L! D% H- _; I* R7 \<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
  J" r, X8 @# x3 p0 F: C* G8 v<%9 v* y: ~& ~+ c
  cdatasource ds=new cdatasource();  //数据联结bean实例6 |) C3 s/ t8 P% J
  java.sql.connection conn=ds.getconnection();; S/ }9 L! ~9 H) N9 b+ u: z6 h1 ?
  java.sql.statement stmt=null;
+ k  o- B1 C1 l# x, e5 A" M  java.sql.resultset rs=null;8 U" k+ W5 u' V. z( b( p
  cdatacheck dc=new cdatacheck();
" }" \# M4 n( e5 o5 z%>1 U2 l+ q! n3 E
<%* q* ?* t) d2 J
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";1 u) m) H- ^0 C2 P( [2 y$ a
stmt=conn.createstatement();  @) h  h& J# ]6 g) Q
rs=stmt.executequery(sqlu);
8 u: n) \/ U: C5 \%>8 y. Y$ Q% C) O$ Z* {# q
<script language='javascript'>- g" }8 N$ c4 p9 g  r: Z+ e0 W
arr = new array();3 T' ]. f3 g% x7 _3 I# Z' o
<%  int temp=0;( ~2 J! F! k( L  D5 i" i7 O, x
while(rs.next())
8 F. i" c; j) w4 W. c7 [{
& ^, n, q0 N0 r9 c* `%>* Y1 O7 k; E9 ]- N& e; r
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
; O9 o5 S: K! D. R4 v) n8 @0 C<%
! i& K  ?- |) E0 y. Y$ G: Mtemp = temp + 1;* x% L; h6 v% a* P) i
}
6 I' H' X! j1 W* k# T, `%>
% `, l8 [* L, S0 l0 Ztemp=<%=temp%>;  R! T8 ^- w' a$ P# e6 \" d# o
function changelocation(id){ / p% x  E- |4 F# V! p/ [5 t$ v
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
9 W) v9 x; g( Y$ Q9 q$ `- Wvar i = 0; / T. d2 n4 R4 D1 k3 x, d) e1 Z9 G
document.combo_box.city.options[0]=new option('-------',''); 4 w, y! N) n. o- U
for(i=0;i<temp;i++){
* A9 e+ A5 w+ ^( d3 ~) Z5 i: U6 r* E- Uif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] " g% P" N9 ]5 G+ J+ s0 g* t! Y
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); : i* g0 y- N. `. Y$ g
}
+ N8 }7 a0 U3 ?% f7 ?  \. |4 i} $ J$ X) |/ `6 Y8 r8 U8 L
} 0 W; c% R. v1 i0 Y" M% J
</script>
* Q3 G3 B& [0 h: x: B, t# @& B. k3 T- A' U$ h" {
<form name="combo_box">
  {6 ^+ k: O9 ]" A& q! j0 U<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
) _, z2 c; f2 E1 ^0 {  <tr height="24">
+ ^* U0 |; ]4 ^+ ~% P, h <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
4 @: G0 b" P$ Z" P4 m6 N- h <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
* U( x0 w" w5 C9 ]2 g% `' j <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
( v8 T# U, b+ M* j  j$ `4 s <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
- \: E% ?+ |6 R6 k1 K4 d  </tr>- c0 c3 p' e; [! ?9 x
  <tr>
9 z) s# I" R" {6 M  h/ q <td>
! q. w5 N+ ^& X% j) x8 p/ t  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
' j/ s- ]7 s$ o( C  o  <option value="0">请选择部门 ---></option>9 a% F& T9 O4 |) O  p
<%
: t7 l* d7 n: Q* N2 d( W6 I5 x string sqld="select * from tdept";* q0 O% y3 F) Y* G# Y$ Y
stmt=conn.createstatement();; h5 C" g8 {9 S( O
rs=stmt.executequery(sqld);. h, i7 Q: V7 V1 u4 F$ v
while(rs.next())* Y5 [) X8 r+ _! G. o- }! Y
{3 J5 D8 y( L) x2 m6 Z5 ^) m
%>
! ~$ q8 @3 h$ ]  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
  g0 N) F' @0 y1 P. {: Y; K* l  V<%
+ n" ?# B& Z& T; L0 b}
% c$ R& f1 m6 S) T0 o%>   @8 }3 Z$ R4 \/ o/ R6 j
  </select>; y3 K, S3 I' l, H) X, R- l
</td>
- A+ B0 X6 J2 U6 ^' K( V6 a( l <td>; M9 E9 U* |2 U: a9 s9 f
  <select multiple id=city style="width:150;height:200" class="bgc">
3 Z+ n7 @5 J$ w, @2 A  S, ^  </select>. N: w$ Y3 n2 b' ~# W
</td>
& J( O" o+ R& A; a1 O4 m <td nowrap align="center" class="bgc">
0 p4 z) z2 \7 X& q( D9 G% j8 m  <input type="button"  value="<<" class="buttons">
3 ?( Y- c  t8 n; J, U6 y  <input type="button"  value=">>" class="buttons">
3 {! v/ z/ A, }8 ?6 p</td>
0 H; s0 Z; ~: {+ D- s1 x <td>
: X* t: x: Q# i  L  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">9 `0 i7 `! F" N. u1 z. |) r! A
  </select>8 @9 H2 m1 n) p1 N1 O8 {
</td>
" [* H$ _5 N3 h* w5 A. S  </tr>
( b0 T4 M+ f0 V( N( T <tr class="bgc">
+ w' T- C& h" Z% C# ` <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
3 {* _' z: N( f, M( g$ K- I6 x8 H0 j  </tr>: O! _! v) W0 l) x' e& }) p
</table>
, c$ C9 c) m/ u- U; h* E& U/ V7 o( y</form>
9 P# P( I3 d# t+ i& G1 c# i<script language="javascript">2 G+ n0 a' w0 O5 V
//人名移动
9 P% z! g1 X/ u; _function move(fbox, tbox) {
- X/ b. q8 E. ]5 Vvar arrfbox = new array();' M# k5 W6 i6 R4 j; @+ b
var arrtbox = new array();2 a( ^/ Y8 E1 z5 K8 z1 Q
var arrlookup = new array();3 [* G  L+ `: H+ y; w; f+ D
var i;% A$ v" M  C& m! K1 i0 c0 |
for (i = 0; i < tbox.options.length; i++) {
9 w1 M. S3 h) L" b' varrlookup[tbox.options.text] = tbox.options.value;: Z& p, @. O4 e0 A7 Y2 s. F( W4 g
arrtbox = tbox.options.text;: J* M3 b2 F( F$ N  T2 m
}
+ Y8 o0 M5 |$ d% I& ]: }2 svar flength = 0;) e8 M" ?, |: d* f+ M
var tlength = arrtbox.length;
2 i! u1 P9 B  K) pfor(i = 0; i < fbox.options.length; i++) {/ \$ x  v- \8 r& B) c1 |( i7 g
arrlookup[fbox.options.text] = fbox.options.value;
; m4 G: t8 D7 G* W$ c' \: p" zif (fbox.options.selected && fbox.options.value != "") {* y; [+ Y1 N9 h# _, U( a2 W5 \
arrtbox[tlength] = fbox.options.text;
+ r! \% V( b7 |2 ]( Ltlength++;3 z1 D" W' j0 I9 ~
}2 o# C' f" [( f/ x' Y7 X# o& F
else {
7 j' v3 _, `  W7 marrfbox[flength] = fbox.options.text;) G, F& j% B' x7 c* u: t
flength++;
6 N7 s* k( k+ [$ V- Z0 B }
2 s, l3 H9 g! I9 {/ z/ C}' m7 b2 C- q+ `, G2 j, Q
arrfbox.sort();1 C; F+ z; A, g6 n9 h
arrtbox.sort();
) b* h9 X% t0 t5 X5 r  o
8 C7 @2 Y: W9 t0 J) K& jfbox.length = 0;
& J& {: K8 @0 o# c8 vtbox.length = 0;
1 c2 x1 `5 s" ]9 V' Pvar c;
5 l- v7 k0 U5 F/ ]7 Q: T5 @0 Pfor(c = 0; c < arrfbox.length; c++) {
( b, b* R9 A( m4 Q5 {" Y. Rvar no = new option();
7 H' A" C7 F' j: z- z+ p( }- _4 Lno.value = arrlookup[arrfbox[c]];7 @" e& [* O3 p& V
no.text = arrfbox[c];* I& u' f3 J: W; `- n" W
fbox[c] = no;! p9 W% b& e$ Q/ {( `$ [
}
2 q6 n- T4 g2 u. ]: ofor(c = 0; c < arrtbox.length; c++) {
; w6 e+ r/ j/ D+ s5 Nvar no = new option();
8 {1 P* N1 u$ Y  Rno.value = arrlookup[arrtbox[c]];
3 l0 B3 e& i' c+ ^$ l- hno.text = arrtbox[c];
) q; v' p( a; g0 ptbox[c] = no;
% V, h2 v! y& `7 t. W }
3 n& m6 R6 i+ N$ ^- e/ F}
2 v: ^$ K8 h# D1 j* C/ H- H</script>: `8 B2 W: g: }7 G* P
</body>
$ A: S) M8 c) \0 s, }! B

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

返回列表

jsp+javascript打造级连菜单

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

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