jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"# _% F4 [, m, f+ \8 i! J
      c pageencoding="gb2312"+ t1 |  T$ n# }6 T! ^' u8 F% T9 C
%>
<style>
.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;7 K& K  I. X2 u& l. @% x
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;0 }# i/ P8 a3 o% a
  padding:1px;
  margin:0px;}; D9 b+ X2 d* o) ?7 d
</style>7 D, v0 H. R* p+ X8 c
<script language="javascript">* h1 u. x: \) \7 c- `
0 q: W" d6 w# a7 K6 h( p$ x8 j
</script>; ]( S8 S; s# G# q9 L
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />* @2 B5 `! W$ L) v+ a8 T) ^" J
<%& _- a7 }' _! O* K& O* E4 F. l9 P
  cdatasource ds=new cdatasource();  //数据联结bean实例4 `/ B& z: K8 y7 V+ A0 w! B* U
  java.sql.connection conn=ds.getconnection();
8 Z  l2 z" l9 Y6 B  java.sql.statement stmt=null;
' c/ c  n& S* N1 N" w% [: P, K+ y  java.sql.resultset rs=null;" M) m) y8 b0 \$ _
  cdatacheck dc=new cdatacheck();
; d$ b. [/ d9 L/ ^+ W0 C+ e2 c%>) x- @7 D& Z$ j9 s/ q. \; A
<%
6 c5 P: X. ]8 j0 ?% ostring 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";( p, r, X1 }/ L
stmt=conn.createstatement();
* C$ \% R& V, [; U) ]6 _8 Urs=stmt.executequery(sqlu);
7 u8 F; J# C" m+ g! D%>
+ V9 }9 q. V, k4 H; ~<script language='javascript'>1 `  N! X: J  o; S- R8 W8 B( q
arr = new array();6 m! S! {2 I' e1 W
<%  int temp=0;0 G6 P, Y; Y+ z, o! `" |+ L
while(rs.next())
* D; S( q$ P/ ?* t4 `{
7 m2 K& k0 V1 q5 Y%>! ~& g) Q% s! _
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
& c2 m' ?( q  d) x4 y& [$ a9 o4 k% ?<%4 F4 Y& C! S  o6 T' o+ @: R: B
temp = temp + 1;
: p1 s+ \9 \' w2 M}
# h+ B& e% T" T8 [4 B% h# i%>
3 ]1 _+ h- z4 ntemp=<%=temp%>;. |" m5 o/ \5 f! ?/ q* ?
function changelocation(id){
, Y$ ?9 Z0 n- adocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
5 L! t8 j$ ^$ i/ k9 e: {: X: Qvar i = 0; ( }4 r9 q! H; Q7 b6 B
document.combo_box.city.options[0]=new option('-------','');
9 k7 K: w4 H# P2 l/ M# Yfor(i=0;i<temp;i++){ ! L# S4 M$ K4 `6 ~6 J
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] / M/ h% c. o4 u; z  O. U
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
$ b5 W, X9 S5 e$ o; f6 `1 x}
: y% U( M5 e" r6 K}
' i% T3 j. G* J  t5 Q" K}
  x1 u) |) t. H: w0 x</script>
# M* ^& x. Q) r+ U) K- b) H2 X4 E
4 ~( I+ f  F. b<form name="combo_box">/ U9 Q0 f5 N; r, e5 x
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">  c1 _: c# ]6 @& p, h1 d! Z
  <tr height="24">* D) a- S5 E4 N) R2 x! b- Y
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
+ I$ E" u7 M0 E, f+ P <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
2 t3 U/ T: _  r( q! {# ^ <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
  ^; j" v. b( F; [ <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>- E+ ~: c& B& q+ \4 W1 h- i
  </tr>% H5 R- @1 @4 N6 p; G3 Z& u2 }  M
  <tr>
; C, p# K. g: H. ~7 {  M' m7 R <td>: X: o/ V% n( r( |9 v; k
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">! g8 I! X1 i& h7 s: E/ o, A( b1 Q
  <option value="0">请选择部门 ---></option>% `6 m9 }; J8 Q  \) Z* |1 r% a. D
<%7 q) s- C" J% \: B  [# P
string sqld="select * from tdept";0 Y% Z! s1 G: M1 G+ O- p$ h! R' c
stmt=conn.createstatement();2 `  p3 e. u$ G) y5 z
rs=stmt.executequery(sqld);
8 z& K0 C* f8 D, [% `8 D" Pwhile(rs.next())
/ N. C+ Z) ]# w9 b0 M{
- y0 w+ p: n5 r! G2 w% m7 Q+ A% `) |%>
0 V) @: b2 E* r" i, K! P  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>6 f" b/ n6 d- A7 M# g
<%2 T5 I" J& z+ \2 q" C5 o
}, ?1 X' J  J* L
%>
0 F) b4 j  _$ q: k+ [  </select>$ {+ s' {- @! _  y8 c
</td>, t3 g3 f* b5 R9 k- f8 G
<td>, r/ B( }+ k" T0 ~
  <select multiple id=city style="width:150;height:200" class="bgc">0 S9 d1 \2 G; u
  </select>, ~: p+ `7 @2 b- _
</td>! L( V) s# B. K6 Z# ~& n
<td nowrap align="center" class="bgc">0 J5 F5 y+ O* J: I  H9 V1 D; p
  <input type="button"  value="<<" class="buttons">
/ p1 Y2 N7 i2 @2 @: w. }  <input type="button"  value=">>" class="buttons"># d9 K8 _$ V: S
</td>) e1 Z  `) D9 V8 X4 P% j! n% I
<td>
% m+ E* d3 S, O  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">; ?7 q5 q) i* H7 R) U
  </select>) d5 m1 D$ P$ |  r4 m
</td>4 V6 K% w+ U8 N" Y, `
  </tr>
) l) l1 j, `/ p9 ^' R5 b <tr class="bgc">
0 h' O4 _: s* N4 t5 A  h* T/ f <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
  W; n0 A* p- I1 ^' _  </tr>
) g; w% ^! D! g: c2 ]: ]( V</table>; u  O4 f, c; J, t% k
</form>1 `! N7 F' x7 Q5 E# c5 c
<script language="javascript">+ J2 ?9 X' @0 [" |( O
//人名移动" c; [5 N( i1 ~+ |, K
function move(fbox, tbox) {
7 u5 E1 U; p: m6 N1 qvar arrfbox = new array();
* ?0 p& @" H  t$ Jvar arrtbox = new array();0 Y0 L' k7 z$ k
var arrlookup = new array();8 q  P1 y! {; U4 \, O7 x: _1 {& M
var i;( p, H, \2 ^9 e' ~; U+ U( {
for (i = 0; i < tbox.options.length; i++) {3 i) b/ I6 n, F  d& E
arrlookup[tbox.options.text] = tbox.options.value;9 E, Q- ~9 c4 u% j; R0 }
arrtbox = tbox.options.text;* V! E/ \/ M7 H6 z
}
2 w8 Q+ X5 }: ]. ~var flength = 0;
* g" ?& p+ c8 n0 l( Y( l6 bvar tlength = arrtbox.length;/ a7 p. D1 N  A; o1 W
for(i = 0; i < fbox.options.length; i++) {
: k6 [& U4 W8 n( o6 a7 _/ k: oarrlookup[fbox.options.text] = fbox.options.value;4 Y  y1 h/ L  N$ U
if (fbox.options.selected && fbox.options.value != "") {0 `) |" j1 F1 }+ x
arrtbox[tlength] = fbox.options.text;( W& D6 d  _: W+ q. L& k. r6 R
tlength++;) S: i: z) e0 n! U9 I1 k6 O# `
}6 H# }7 s& T9 Z6 c  P0 e
else {
% h* Y2 ^, q' @$ F9 yarrfbox[flength] = fbox.options.text;5 C0 m! U5 G' ]
flength++;% K: V8 T& t- P# Q: l
}- b9 Q9 M- J1 d5 S4 i
}
: r1 r% U/ C* H+ C/ v! Z/ oarrfbox.sort();! w; Q8 p! |0 u  c2 v
arrtbox.sort();
4 O4 M  W0 g- L: H3 G
fbox.length = 0;: A# _8 ?  X& f* [5 W: H
tbox.length = 0;) ]) V- ~  Q6 m" n3 l6 g( ^$ p
var c;
( f5 Q& l; D/ h8 ~1 C7 b2 b3 _5 ?& Yfor(c = 0; c < arrfbox.length; c++) {
& b1 d* M# b! I0 _var no = new option();- b( M6 s6 \' N: k3 v
no.value = arrlookup[arrfbox[c]];* R0 e) f( h/ t1 [5 v0 T
no.text = arrfbox[c];4 W7 S' h) U- H& l& ^
fbox[c] = no;
$ T4 {6 w3 M, l% U}
- Y5 K6 e: L( l; t; A# hfor(c = 0; c < arrtbox.length; c++) {
3 h9 U. ]* e' E' _var no = new option();, K( }3 e6 E) t) g8 r3 U1 @" [4 K
no.value = arrlookup[arrtbox[c]];
. j. E. b0 G* }3 [* i/ g4 Zno.text = arrtbox[c];
- p0 d) b0 x: Y; h# `7 Ntbox[c] = no;
: l7 W( l6 Q* l: w" `# K! @ }
2 q/ T! C7 h9 p. V}- x: i8 r, s, J# `) T
</script>+ X6 y" j9 `2 k" v9 n+ Y2 C
</body># R1 f# Q. t0 N1 h! V) k

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

返回列表

jsp+javascript打造级连菜单

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

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