jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"9 U6 }0 m" ?* C! i9 K" t3 C
      c pageencoding="gb2312"% y2 U' F: k7 q: G) _
%>/ T7 F. q/ o! j8 }  l
<style>
.f9{ font-size:9pt; }
.bgc{ background-color:#aecaf9; color: #0033ff }3 T* W5 `  s' ^7 z3 y, h1 t% h5 T8 G
.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;9 s1 S, b9 a6 ]9 T; K
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;) \. P$ d) K# S$ M3 V
  padding:1px;6 n  G6 ?5 w' U3 f: V5 Y" Z7 _8 n
  margin:0px;}. y5 P4 p9 i6 f5 x1 O' ^
</style>
<script language="javascript">

9 z; o+ j7 v9 O7 \3 G6 u+ W5 n</script>/ V& {# F( I: M6 Y* ?0 i, t
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
% G" }7 v* M- x9 E3 M/ ?2 V<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />5 P5 R" J1 O1 a" X8 ^
<%( t% Z6 X7 V2 x% h9 h4 T
  cdatasource ds=new cdatasource();  //数据联结bean实例
* t$ ?; C, ~% s* q5 d  java.sql.connection conn=ds.getconnection();
: k; f; h$ X& T) m  java.sql.statement stmt=null;( n" L7 T( g2 B3 N5 _
  java.sql.resultset rs=null;+ w" h: B( ^, h6 C6 ~3 P" ]0 n
  cdatacheck dc=new cdatacheck();( J/ i; Q; T& a) B% l
%>+ m5 Q! c" @* p+ X, v2 s
<%& Z8 U5 ^! n9 S. ~9 ~% P# V+ a/ 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";( F" s, ?: h( O- Z2 C9 X/ y# ]
stmt=conn.createstatement();
2 \+ Q5 [; g# crs=stmt.executequery(sqlu);" V; G9 @3 f5 x1 e# J  Q" L1 L1 x
%>
5 |1 o. L- G2 X* V( F+ [& H<script language='javascript'>
7 _  x3 y- X0 q4 zarr = new array();: _( f  N' E6 [& ~9 b' ?
<%  int temp=0;
& m' W3 \/ c  Fwhile(rs.next())
( k* ]. i* W* $ F8 _{
3 W' S( \2 \0 ?2 l! Q%># k9 k& S7 T; R$ f
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
, g1 U! u* t6 k2 d# O: I<%
8 Y  n- t$ d3 S$ _- ~8 ntemp = temp + 1;; v$ h- n7 Y2 ?! z7 F; I1 G
}. Z  n) Y  \$ e: _& w) ]
%>
1 d$ a+ r) X. F/ J  H6 ]: [2 q9 Otemp=<%=temp%>;
. T' x8 A" K3 $ k0 qfunction changelocation(id){
) c6 R( M- \0 B5 Y) P4 U6 @% Cdocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
, z/ z4 y0 ?' y3 l+ U1 z. w8 lvar i = 0;
, R7 W6 p% k+ _: t* A" [document.combo_box.city.options[0]=new option('-------',''); 7 Y* q/ d. G9 A' c$ G
for(i=0;i<temp;i++){
: ^; m* h, \5 B' v$ n; V+ rif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
8 u/ R+ G5 H  c# K! d+ gdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
9 S( Q) Q) C, S( D}
) ?0 i. q1 @9 W) P6 d, h}
4 Y7 R4 X% j( q" P; ?}
+ d8 f5 D' F3 K0 K- p% [! {</script>
: T8 _, J$ v% t3 p+ q, K! U
( ^( D- }1 N& ^' G9 s  K<form name="combo_box">
/ s+ f1 ^8 J3 h$ U. J<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">, \$ @: n$ e* r& U0 ~2 {
  <tr height="24">, H2 @; q% J- k0 m4 }
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
6 u. h$ o4 d+ P4 t8 s  W9 } <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>: e4 V/ l2 `4 ?
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>1 e$ `- K' U% L1 ~6 k* b0 b- D
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
3 s* f9 X2 {' t/ m* U" d" l# Q  </tr>
) P7 g. {9 e5 C  l6 N! ~. o2 N  <tr> 7 Z  b+ W) j+ {  }
<td>$ A2 ^% `# W$ H$ @
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">" @2 _4 C+ ~( ?; @7 ~: _4 X) m
  <option value="0">请选择部门 ---></option>
, t* {4 }* M6 e0 K<%8 T. a% }. Z5 G- _2 n9 v: F4 Q5 x0 S3 N4 R
string sqld="select * from tdept";# x7 q  ]2 w8 s0 _. U( m
stmt=conn.createstatement();- ^* \  j" s) J3 t* c; u2 g0 y
rs=stmt.executequery(sqld);
1 P" V7 x% O4 }0 B9 I5 j1 r8 dwhile(rs.next())
4 f4 |) z* Y2 g, I, r& b" _% t! S" D{
0 `5 j9 @( {$ s; G& L%>! S3 i2 X9 k, d4 o) |  ~
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ c9 g9 f. W; {<%' P  H; u4 q0 N  k2 y
}9 }4 o/ U) H4 ^# _. H
%> ) i5 k: D- A# T
  </select>1 j: {- o6 L3 K' P4 J
</td>
% J% ~4 c$ N( \ <td>  w8 E# J1 V3 c% P! Z! y
  <select multiple id=city style="width:150;height:200" class="bgc">
  n' u% ^4 p" s1 \8 C5 r) \  </select>( k- \4 L6 H( |" ~5 F) h7 a5 q
</td>9 L, l; r6 ?! y3 @# m
<td nowrap align="center" class="bgc">
( x6 w4 Z, i' G" P, |5 W  <input type="button"  value="<<" class="buttons">
4 ]8 _" ~5 v9 ?: Y  <input type="button"  value=">>" class="buttons">9 `. [- s2 e  ?
</td>% O* o( t& N8 x/ ?
<td>: `1 d( F# }6 c/ T* p
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">! S& P: t$ _$ O0 o4 C1 b
  </select>
1 {- t: I4 E, C2 h, ~</td>
+ N9 v) K' ]* Q0 b+ s  </tr>
- G* u& e1 t- d2 t; g1 ?+ @  h <tr class="bgc">
3 d$ B8 K! {8 z$ E4 _. z0 t <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>- W6 N' u' ]% ^* ~/ D( r
  </tr>
& j! ?7 ~# P. [( p% X</table>
2 C6 h2 o4 V' u* P6 ?# @' |4 z8 y8 t</form>0 v, O$ n& f! l3 c- M: B
<script language="javascript">. P5 I/ J1 ^3 q7 i
//人名移动5 B' B* J, F4 m
function move(fbox, tbox) {
* H( H0 t% V8 Lvar arrfbox = new array();5 B) T- X; y6 W: x- Y
var arrtbox = new array();3 M4 h+ B/ P0 ?% q0 ~+ Y& X
var arrlookup = new array();3 K* u& n! `. T; F+ Y) V: v$ j
var i;6 n5 a: l& m3 f$ I* }. c; F
for (i = 0; i < tbox.options.length; i++) {8 s1 u. c( P2 E; Z& L
arrlookup[tbox.options.text] = tbox.options.value;+ W( y5 \6 U5 x) L
arrtbox = tbox.options.text;
% }8 a" C' |3 x}
  ]1 I; e  F0 D2 `var flength = 0;
# Z. u: x& V2 g9 xvar tlength = arrtbox.length;
2 z* n3 T- g$ {$ Ffor(i = 0; i < fbox.options.length; i++) {
9 m* }- J: v$ a$ c1 E# d+ R4 ^arrlookup[fbox.options.text] = fbox.options.value;5 A( i7 X6 [2 t4 U1 N  [4 H: O/ g$ M
if (fbox.options.selected && fbox.options.value != "") {
# S  V% T* D: aarrtbox[tlength] = fbox.options.text;- o% r5 f% K$ s$ Q1 Z( R, v# R
tlength++;  I) d. l; u, U: y, l" S
}: ^- C; F* x6 B+ C7 i5 e5 s( ~
else {: S# N2 L4 ~* m# V
arrfbox[flength] = fbox.options.text;  j: t9 F1 T, o$ t8 |
flength++;
' k' j0 g! d- }/ H: y }
$ @* }* h! p6 l% f' l/ |) w}' v- H# j5 \" @
arrfbox.sort();
( }! N% ?- Y, l% z$ A9 F5 m8 G7 harrtbox.sort();
6 `* Q& v9 @) f6 N8 K7 c4 E1 Q( \; S' o% e
fbox.length = 0;
- [! M0 B% N" y0 Ftbox.length = 0;
8 c9 z) t2 w; `# F0 H% S% z' s2 i! Rvar c;0 Q. k2 O, H7 R
for(c = 0; c < arrfbox.length; c++) {
8 i5 Q  e8 Z( |" j& N1 ~9 jvar no = new option();
: ]. m, M+ u, |1 }# e9 S  Fno.value = arrlookup[arrfbox[c]];
/ Q% n/ K. ^9 z7 q) Q. P# c' ~: N& fno.text = arrfbox[c];* d2 P) c6 M) k) o9 X. i+ M! W8 C
fbox[c] = no;
. k! Q' @& j! h7 D% E# q$ n. j. ]}- c" I% U) N0 i8 a% b2 T
for(c = 0; c < arrtbox.length; c++) {
# _% |$ Z# U& Z0 x5 }2 ~var no = new option();
, {" d$ o. n2 a" w- lno.value = arrlookup[arrtbox[c]];
5 V! N- g' [; P* O+ jno.text = arrtbox[c];, J1 |; L. F0 m: y" U( n
tbox[c] = no;6 S8 |+ _/ P( Y5 o3 ?* Z
}9 v" p9 Z! H2 o8 `
}8 Y! x3 M8 n% j* t9 f
</script>
0 A4 |, p2 {2 B. I</body>
' l+ o" c1 N% T; m; v/ Z

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

返回列表

jsp+javascript打造级连菜单

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

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