jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"" h1 E& Y( x: M& p" s& V) b
      c pageencoding="gb2312"
%>
<style>9 a  H0 \" u9 X. ]: J$ t
.f9{ font-size:9pt; }; k. x- k. b. D/ d7 `
.bgc{ background-color:#aecaf9; color: #0033ff }7 \# m4 ~+ c) l4 F" F' R
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;/ a5 a6 G+ X1 Y% q5 t9 H: D) L
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;* \2 n  |0 ?3 L" O
  padding:1px;- ~) |/ w9 A/ ~. |, b1 w% m2 I; n
  margin:0px;}
</style>* L0 `& _  h/ d  M/ q
<script language="javascript">& P" ~& u; s9 C; K, V

% h9 T! E. _( q; o2 C</script>
1 i; M; ?9 m1 x( m% I+ y<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">( C8 `# g4 M$ N) U5 W% i3 X( ~
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" /># N6 j/ H7 e# [0 l5 x
<%( G- [/ N) W5 ?8 Q3 y
  cdatasource ds=new cdatasource();  //数据联结bean实例" V5 ?% f; U: M1 r" F4 `7 D; E
  java.sql.connection conn=ds.getconnection();* N1 L# f( |- e; f( x0 _
  java.sql.statement stmt=null;. ?4 P* {! t4 c; C2 F$ Q& n
  java.sql.resultset rs=null;
) O$ m- y3 [' T  cdatacheck dc=new cdatacheck();0 |! }3 p0 h: h0 J0 |
%>
# s3 s7 Z; W$ _. S3 r<%
" p. X% U$ O  J6 u0 ~6 n2 istring 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 Y) w3 Q8 H4 W
stmt=conn.createstatement();0 C( `, b& a5 V. @# O" v6 I
rs=stmt.executequery(sqlu);! k9 Z7 a4 ^0 Q2 t, Y0 F/ P3 S
%>
+ o% ]8 a& v% ~1 s7 u7 l2 \<script language='javascript'>  @) m9 J' L$ D
arr = new array();! t2 J" F5 e! c" K2 c
<%  int temp=0;
  f( q9 s, I' d" G% @' wwhile(rs.next())
- t, g/ j6 I. S/ z, ]% R! p{
: p0 v4 `* W$ ?  j" A& i4 J%>
, d0 a+ {9 z- l7 X, o# W) garr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");1 c8 Z* g$ @0 E; b6 \' Y1 R' Z
<%: S1 F) \0 j/ m3 R$ r4 P3 `
temp = temp + 1;  x  u: {5 a7 K% E' i
}6 b3 r5 c- J0 @' p6 d! l$ D" m
%>
! f" \% |0 \* G% }4 q) Qtemp=<%=temp%>;, j' X* ^7 c0 D/ A; b4 s: z
function changelocation(id){
- F) ~0 A3 ?0 h6 ~5 ^document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
& W- O4 |. g) O* Ivar i = 0; ) a$ ?# M7 S: i. Z5 h9 w3 k
document.combo_box.city.options[0]=new option('-------','');
& o! x3 N& r$ U  w; tfor(i=0;i<temp;i++){ 7 P9 |2 M# v1 M: G8 h7 ]
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 5 P/ L  w- \, [& k$ e% Q: a3 R% K
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); ' c2 [0 V/ K1 y9 z# O/ d
} ( ~4 g$ c/ `, l4 A- p" Z8 B
} 0 r: U: L5 h; J5 O# L
} - U3 }6 R( u1 Q- }7 w% T
</script>& k( A2 p5 Z$ x8 U- E3 W$ U
8 c1 Q( _' {0 x4 q) o8 Y
<form name="combo_box">
- g) L' K8 k0 x: `<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
' `8 H; g( n- X" @  <tr height="24">
4 ]& g* I4 O) Z <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>1 {- S2 Q' i2 s7 e# U6 Z9 `
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
" [& S9 b" g# y  q& | <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>0 e; K7 a0 b3 C' d  n
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>4 Q+ X! {$ y( Y
  </tr>
' V( }/ N  P% l! K  <tr> - j* m( z+ V8 \5 s: g. a$ J6 X
<td>8 }  L" w, J7 i" A, o/ P
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
, T0 \0 l: t, Q0 c8 L  <option value="0">请选择部门 ---></option>
# O! w  |0 n4 q7 r) }$ ~<%; I3 S3 a1 C. ^& j7 n: v  I" u
string sqld="select * from tdept";
2 C6 n. b% G) \" Q3 Fstmt=conn.createstatement();
% Z) U; r; @6 g- J/ qrs=stmt.executequery(sqld);
9 c; Y' Q; H+ Q$ p% Y$ v8 G! Y/ Vwhile(rs.next())( H# d! a  I" Z+ O$ E6 L6 }2 P
{
% b7 I7 H& a& |%>0 |. F; X" J9 k9 B1 R/ Q8 _
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
! ]3 D0 |; s/ N+ d<%
6 }/ m: E3 A4 U5 B& d" a6 q# Q}% ~# X% @) Q2 R  _! ]) B- A
%> 8 ?; t1 V& K/ V- s6 B: p
  </select>
3 y7 i" a$ \4 s* |5 l2 T" Z</td>: _2 i6 \/ a$ L" X" Y" t
<td>7 u! I# {9 ]; i, |" T
  <select multiple id=city style="width:150;height:200" class="bgc">
' _6 S7 I" z% s  </select>
3 I$ W+ ~5 |% X2 l3 |* a</td>" u( k4 H+ _/ V4 Z$ h( s2 y
<td nowrap align="center" class="bgc">( }: }" ~3 ]3 C5 i' d
  <input type="button"  value="<<" class="buttons">' O" B5 M, J5 ?" v5 E
  <input type="button"  value=">>" class="buttons">
5 B- B, o& a, y( }7 G$ p8 H0 Q</td>7 ~8 h- ?2 |/ U  P
<td>
' ^$ f2 G" I' u  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
! Z0 r" a6 Z! k% c, t4 l2 K  </select>$ T' U3 }1 A5 [9 J' p9 E/ ]
</td>
- U. i6 B; c( W& E; b* B# ]. D  </tr>% O! r5 r" `6 @& U" L$ E
<tr class="bgc"> ! M- P8 p4 x! i
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
) O, J: w$ B/ v9 Y0 D$ [  </tr>1 M' G" N' C) I8 D" x
</table># j) `7 g& a7 h, A( B2 O
</form># U/ G# M; t, V6 I
<script language="javascript">
% P/ D! w- E$ S( p//人名移动3 s2 ~  Q9 ?6 k3 E- X, f) Y& h0 J
function move(fbox, tbox) {, [  l$ h7 O; V
var arrfbox = new array();
- T, M1 o) G1 h) ^2 j8 ~var arrtbox = new array();  f9 T) T7 h- `* d3 k
var arrlookup = new array();
0 i3 u& F: n% w3 x7 j% O2 i) K* Fvar i;
, p$ p. z& ?+ d3 O/ P( [. c; ufor (i = 0; i < tbox.options.length; i++) {- J9 r/ n6 t- k
arrlookup[tbox.options.text] = tbox.options.value;1 L9 \8 t+ u7 k( r2 f* S: A: u& Y
arrtbox = tbox.options.text;
% g0 k- I: s* c3 V. |% e2 n}4 I( |7 ^8 H& U# m( m
var flength = 0;
. k9 ?$ C# ], E9 I" @0 g, Uvar tlength = arrtbox.length;
8 N, A# n& y* j. U/ qfor(i = 0; i < fbox.options.length; i++) {  V  a- X! W6 i
arrlookup[fbox.options.text] = fbox.options.value;* d. ^* o9 J. m# o
if (fbox.options.selected && fbox.options.value != "") {
( v- c; n8 X; W0 Garrtbox[tlength] = fbox.options.text;
) b2 s7 _' ?& K8 _: [tlength++;4 [8 X9 p8 I5 t. F8 V9 m
}
+ d9 @/ c5 T0 |. ielse {
+ N/ P( }( q2 K) |, H1 h+ K& `: Zarrfbox[flength] = fbox.options.text;
9 d5 U8 ]7 Z" d6 eflength++;' K* [0 K9 x/ ?& p
}. q) J+ |5 e& U$ M& T
}" `' F! V- s7 l6 U; P( m
arrfbox.sort();
2 ]' E9 B  u! C- Q2 w- Narrtbox.sort();
  a' I) f0 I0 M) K; Y; j. }( e8 ], {% l/ E
fbox.length = 0;
5 `" O1 e/ }8 [$ x) f- \. Wtbox.length = 0;
" C7 X9 G- g9 @% {  x5 U9 }var c;. H7 o9 r& y: h% s' D7 [
for(c = 0; c < arrfbox.length; c++) {9 M4 q, ?) q% S2 I: b0 U' ]: x% }
var no = new option();
/ K: r% O, `- X! e0 `no.value = arrlookup[arrfbox[c]];
9 h6 l4 O( a) c* mno.text = arrfbox[c];0 R0 J. w4 R+ \
fbox[c] = no;
/ U/ e5 W1 _" e6 H3 @0 d" q  I}
, N6 j1 v$ d/ j. ?for(c = 0; c < arrtbox.length; c++) {# [+ @" _& @8 b& Q+ P+ O# p
var no = new option();" A9 ^8 L& m$ G3 Y) G" A% n
no.value = arrlookup[arrtbox[c]];  G4 n9 ?" w: a9 p' B
no.text = arrtbox[c];/ n+ O/ P- m3 W( c
tbox[c] = no;/ Q- z! q1 |4 b$ C% m* f2 t
}6 S& `2 J: P) B& y  m
}( h- e9 w1 h3 r% u: i. y
</script>
4 H5 a; L/ P. d9 y6 N, {4 a+ p; \8 n</body>' C# n$ I8 i& s

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

返回列表

jsp+javascript打造级连菜单

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

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