jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"
%>7 ^: C5 y4 ]  |( Z# ~! [
<style>
.f9{ font-size:9pt; }
.bgc{ background-color:#aecaf9; color: #0033ff }- E7 K& x" A1 M! u0 o& \6 z5 ~7 g
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;" a( ?/ h, k  P/ j
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;5 O! Z! w+ t% q$ k" M( H, c
  border-right: solid 1px #5679bd;: N7 T2 y4 W" t7 n# R! m
  padding:1px;
  margin:0px;}
</style>/ g' f. i4 N+ d; p+ y3 d- O$ h/ p
<script language="javascript">* |! l" W( I* r5 C2 _: y: M0 ?$ ^; c
% Z) t: u. M/ B: ^# q3 E0 `- B
</script>5 ?7 n8 }. p) ^% T) g2 [3 o& g
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">; }! ?2 t; q; e/ f3 C7 M: G
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
$ F9 ?8 f) Q) p4 p. N' V6 s0 Q<%
  k; p/ }1 w# `' Y7 i  cdatasource ds=new cdatasource();  //数据联结bean实例  \' w* Y$ \: L7 G
  java.sql.connection conn=ds.getconnection();
2 ~0 l6 o8 P4 M- i2 l  java.sql.statement stmt=null;  |' t6 @3 x- J7 F2 M- r( n+ }6 B0 K
  java.sql.resultset rs=null;
. g0 a7 I1 Z% Y  cdatacheck dc=new cdatacheck();
& Y0 \, B  j7 Z%>2 k3 W8 i; X+ l; b* m& k. Q
<%' N) x1 Z/ @( t- Y
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";
" h. E5 D# L" @  {, ostmt=conn.createstatement();
. D" y  F. R* f4 B/ v' n( e0 Ars=stmt.executequery(sqlu);: V# T6 t$ A2 T: t
%>
1 N( c+ U9 O9 O<script language='javascript'>
% G" w1 T1 s9 ?' U' o' m6 }arr = new array();7 r( u5 i5 k; _7 @# g1 ~4 I
<%  int temp=0;' {( {8 X, Y# b+ f6 n) `
while(rs.next()): W2 I; G1 c3 O: \# |& }
{
7 P2 J- |$ m7 {2 L1 F" @%>4 B/ |8 z6 V# M" k; R; ]
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");+ j* n5 t+ n* r
<%
" O& z# ]1 n: P. P; A7 L. O: f2 Ltemp = temp + 1;
1 O6 U) r3 h& w}% A, M  B) N! M
%>
* q+ q7 [4 Y+ v* |temp=<%=temp%>;- f, ~$ t& X9 L/ j
function changelocation(id){ - r# G0 h2 M" d, L& c* ?2 o( d7 B# ~
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
: t8 K) V/ M5 e* E% f  lvar i = 0; , b: \) ]( B+ l( ]/ c. u
document.combo_box.city.options[0]=new option('-------',''); % H3 x3 W) Z$ {  P, e4 f
for(i=0;i<temp;i++){ 3 K% u) G; H0 Z: c* g  g
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
1 }2 A1 E3 A9 F% R6 \document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
+ U& k' k+ a0 ~' z, {7 f# E} * `2 b8 q4 x+ S. T
} 9 U: [. v' @! Z/ Y# ]% x
} 5 v6 `9 R  L- @! t9 G
</script>
5 h: ^9 h; s) C$ X6 `6 S3 W) w( z, Y) e# Q8 e! c2 U! q
<form name="combo_box">
( G5 b1 M* O4 X; l; l* x<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">9 P. q) V! u% f0 w
  <tr height="24">+ }+ |+ {1 j4 w9 ]) K' J
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td># E+ ]; {* d9 ~  a2 h' a
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
. x5 C4 P+ w" `3 x- ^7 h <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>9 Y( `6 j- g: y% F- c: Z/ C
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
/ w  G8 N: Q" t/ q" O, g  </tr>
5 Q0 P3 T& \* U  <tr> 6 t) t4 \5 Y1 l3 x5 K) O! \
<td>
9 J2 [) B0 W! l1 A, j  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
' c+ `) k+ \$ C5 V* y7 i  <option value="0">请选择部门 ---></option>
% {  q8 @8 b+ M; z7 j. g9 S<%+ {4 t) c/ Z' E) f! |7 ]$ q7 t# M- q
string sqld="select * from tdept";
6 y* g# D' d7 I6 mstmt=conn.createstatement();
4 h8 y+ Y- y& h5 ?7 _3 G* c# Jrs=stmt.executequery(sqld);; e" E! k" E0 c! v
while(rs.next())
$ U8 d& y) k, F, W5 h% p# }{
! x% D! O9 S. i6 j2 G# C3 C( H%>
' q) j$ T& s& p  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>3 U$ }  T0 H9 j) a
<%
8 p4 V8 z9 X6 t1 Q, t7 ~& V# @}% r/ |; C% k& r$ g/ B
%>
3 B1 R! e$ T2 i# _% P5 N1 H! v  </select>
' V2 ]$ D, N" r: H8 V# |</td>2 V- b4 `, b) `
<td>
/ Q8 U! [0 ?& ]* b" x3 [  W3 L  <select multiple id=city style="width:150;height:200" class="bgc">
2 y$ l, U/ }. H7 E; k  </select>5 |3 v) s# q8 n' `9 T7 {  [
</td>9 H2 z& U9 b% f. m% `1 C
<td nowrap align="center" class="bgc">3 ]* ^6 V0 M0 |0 i4 a
  <input type="button"  value="<<" class="buttons">/ E% X) P  q5 L$ M( ~
  <input type="button"  value=">>" class="buttons">. O; A: z7 s0 \5 E1 F
</td>$ a; L& x. X* h3 j4 ]4 H2 z
<td>
# i( W8 n; {7 \3 p$ S9 ?  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">- I- {1 @- ^, ^" C& D6 ]8 F
  </select>
% C+ H* ], d7 H) A' u5 ]2 [' B</td>
# o1 e" h  ^# L5 |, d! {( F6 e' |5 `  </tr>
. j0 Z9 ^( C4 f8 W( ^ <tr class="bgc"> 4 @' b2 s& I' t
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
6 c. X0 z4 I, D5 ~" U( M* |  </tr>4 E, D! H. D5 v9 A# z, l
</table>5 O" V3 {( Y4 m
</form>+ U" @+ y- R: d0 T; i7 K
<script language="javascript">; p9 U8 I$ h3 [: \( c
//人名移动
' l4 m1 s5 v' L8 g" H9 ffunction move(fbox, tbox) {
! t5 k% c/ o5 N) @( |& @var arrfbox = new array();
$ m* |; y6 h: D* C6 [var arrtbox = new array();# ^2 X" V( D* c  Q) X
var arrlookup = new array();9 ~6 ]% T' }4 _. O8 B
var i;. i! A9 D6 V6 t7 V# j' a* y& J
for (i = 0; i < tbox.options.length; i++) {! n* j5 p7 t6 ]! c5 @$ J
arrlookup[tbox.options.text] = tbox.options.value;: ]! |% h9 V# n2 Z+ t! S
arrtbox = tbox.options.text;0 m3 l: k) W% R& L- O) O0 c+ V* A; j
}. f" L- y& z+ ]" @( G, Q; f
var flength = 0;. ?# M- `. y( \# O" H; C
var tlength = arrtbox.length;) W8 H2 B8 Y5 k* l
for(i = 0; i < fbox.options.length; i++) {, `, @# h% o" M/ Y) u  i, R6 Y7 G
arrlookup[fbox.options.text] = fbox.options.value;
( @/ F, O! q: Q# Iif (fbox.options.selected && fbox.options.value != "") {
9 G, e$ x( F9 t4 Darrtbox[tlength] = fbox.options.text;
3 ?* ]2 U+ O3 x5 n- d) mtlength++;
; J) g' M) Z- W# Y}
9 ]! r5 [. L% h1 S& @5 Velse {
( F  o9 A( \3 U" K* x% J) r2 Carrfbox[flength] = fbox.options.text;
& x$ O$ S; M& g4 X3 lflength++;
+ r* j% d( ^# I( j# W% p }
8 D3 |5 w; Y. C0 S- ~' Q7 l- `}
5 P& N% C  o) g) b$ A: Varrfbox.sort();
+ d2 ?1 f' ?. k1 O: F( darrtbox.sort();/ P/ |* @0 P- S1 j8 H  i) p4 l

) `' ]7 q" K2 J% kfbox.length = 0;8 S7 r( T$ b7 h+ X; R! e. r& r8 T
tbox.length = 0;' X7 m; `6 e& `2 d( G
var c;
  E; l6 ]! t0 O! Nfor(c = 0; c < arrfbox.length; c++) {# F% j  i3 q9 I( F" v* m* O1 b8 A
var no = new option();
; X# B8 a/ N: `& o$ Nno.value = arrlookup[arrfbox[c]];# d$ L& d9 b" b; x7 F
no.text = arrfbox[c];% H5 X8 u7 Y, n% A& T0 G. f. F
fbox[c] = no;
: y' z4 U4 s: j( O' l}
0 q4 X5 x( v& ]+ E+ ^( O9 `for(c = 0; c < arrtbox.length; c++) {& \2 ^6 ?2 b2 t& X
var no = new option();* ~2 F  o, s5 z2 v; @0 K$ B6 o
no.value = arrlookup[arrtbox[c]];: N* e& E5 E- x3 {
no.text = arrtbox[c];
* W# N0 w1 N# T: p; d7 X. X" t9 jtbox[c] = no;
3 o. b2 t/ U* [8 z+ O }2 f; r  @& K0 \! ~* V) z
}
- k7 s5 N% U/ O9 w8 W5 F. f</script>
+ ?7 y$ Y; Q' h</body>; y$ D' h' n, {  B7 l8 ~

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

返回列表

jsp+javascript打造级连菜单

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

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