jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"' i1 h0 |8 \, V1 u
%>
<style>3 _# {8 d3 V6 n  x/ W' 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;; s# b( S, X' g7 q% Z; {/ k: ]
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;$ {( J+ D( t  V' j* t$ e
  border-right: solid 1px #5679bd;- l0 u8 N) U! h/ J$ z! W
  padding:1px;3 z$ g: _7 t% `8 [* i
  margin:0px;}
</style>; V$ t( ~9 V4 _
<script language="javascript">
+ }/ S  `, M9 v
</script>
9 l/ M( a' ^5 X9 M$ E<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">. X, o+ ]; \; ?& Q; e: ]# e* X
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
9 ^4 F/ p1 C8 ~7 c, V<%
, o( w9 j7 B  C  cdatasource ds=new cdatasource();  //数据联结bean实例
# F" C8 ?: D5 _+ a  java.sql.connection conn=ds.getconnection();
- l4 d! K# d; Q. }, H. Z  java.sql.statement stmt=null;7 T/ G7 P6 ^5 x2 I4 x0 E# d5 w
  java.sql.resultset rs=null;) P, |0 c# k: ]9 s3 I/ v0 x4 B
  cdatacheck dc=new cdatacheck();/ y+ t0 S# C$ c" `$ u
%>, O6 h, s+ z% q' d* b" G0 f2 l* @
<%
9 O0 j& T% T4 ~, b& I- sstring 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";
, Q! v' k  _3 C5 Nstmt=conn.createstatement();+ a* F( A1 A* Z' k$ `2 T1 B9 F
rs=stmt.executequery(sqlu);
" ]9 i% s1 t  q# ]%>
% W8 i  F. B: F: M<script language='javascript'>, v4 d! D, b/ @0 b5 V& N
arr = new array();4 G+ R0 H* _, \/ t! T
<%  int temp=0;
2 M. z& Q- d0 U. @9 B: lwhile(rs.next())
+ @2 L3 a+ i# x8 c/ V* M# Q) P* d{
+ [* |4 p! P; A  g/ b& ~4 e( k( O! I%>
& o2 g: C5 w0 f7 |0 d2 Earr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
& \; z2 l7 i. \* b# ~# K<%
3 D: [: z: y' Otemp = temp + 1;
$ [% \4 U& V0 A}. t) ~3 V6 O$ l  A- d
%>
$ I! K: n/ T* g/ P8 s  qtemp=<%=temp%>;
: E1 Z4 k( @/ g* ~* o) xfunction changelocation(id){
  A( I; x" d* hdocument.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
% Y$ z( {1 m, xvar i = 0; 2 a4 \. |2 K/ ?* O* b
document.combo_box.city.options[0]=new option('-------','');
. e0 T$ f: o2 O3 |for(i=0;i<temp;i++){
1 y& R; T, E# J( I/ n: y: dif(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 0 q$ P' Y9 b6 S6 @$ C, _# Z
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); ' d6 t1 n+ W: V9 ^
}
( a8 t/ W/ C6 X. n} 1 c% t6 t! _/ W4 v. W  f
}
$ U7 M" s* T- T6 i- W</script>
$ @. T' t) ?3 L9 A8 _. P! W: S7 @2 I' Y2 S
<form name="combo_box">
3 b* b3 H, g0 y) d<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">& N: P$ G: C' _8 a8 i
  <tr height="24">; y0 h' u5 n# L$ m. H% @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>. o- I5 }8 B# I5 u7 E( k* e
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
! }) c, d2 M% A; H' B$ [0 d9 @9 P# ^ <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>0 o+ f8 d& Y0 O
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>+ @1 a: x$ [! s. U. n; P( T/ n
  </tr>
' O3 @& q6 I" e7 S& P  <tr>
7 ]9 h2 \8 G' u9 B+ X <td>& p/ \; G' p) E$ S
  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
4 V$ A& _. [, Y2 `; u; H  <option value="0">请选择部门 ---></option>: I9 k4 F/ {& J. a) ]- q
<%& J) m0 S- f& V- H& f
string sqld="select * from tdept";' l* B0 ]* Z9 s4 z8 `% z
stmt=conn.createstatement();
) @' R# N4 ^5 c) l% \! m, x/ ]rs=stmt.executequery(sqld);- }& v! i5 \9 J5 F) L
while(rs.next())$ q, B9 B* s( s& G$ s5 ~1 b, @* [
{! w3 A* i$ e; f  ?7 |) }
%>
; r2 p0 A' s% r' K8 a  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>! S0 i) w6 N% G2 `
<%
# l0 j% t% j  Z, y}) ~. t2 o* J$ }3 _
%>
( w1 ^; a+ ^! o6 U$ T4 d  </select>; h' B8 k+ A& J0 l# r3 |/ n% k
</td>$ v# K* f* T+ f$ b& R9 h
<td>
  g+ r1 {5 I& K$ y  <select multiple id=city style="width:150;height:200" class="bgc">
/ v9 A, h* d# S- z  </select>5 J( Y7 |# @6 i( v" c/ f" P
</td>$ Z' k/ p2 p/ R* ]) r( Q; i  h1 f) P
<td nowrap align="center" class="bgc">
; ~+ A! ~' j' d  <input type="button"  value="<<" class="buttons">% |# r9 @: [6 K% D) w
  <input type="button"  value=">>" class="buttons">
! p3 V8 {# N0 y* B</td>
! Y. L6 b& N/ y  {4 R6 Q& t <td>/ S7 w% L8 {1 u) l" F9 J  c& s0 \
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">  B$ y2 c: P( K/ {( B: y5 U
  </select>6 n7 G/ m2 q9 [7 _
</td>
- P" H9 D! F. c6 s, s  </tr>. l# g3 H! h. N
<tr class="bgc"> ' s" h" R% I; C5 }
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>% U) [$ X, D! c$ |" W# D+ |' W
  </tr>
! d. K3 d& y, }</table>
3 M" F4 o6 g+ V' t; {- k</form>
/ K% T4 Y) h# e1 o; p; V: J<script language="javascript">; B2 T+ w  B) V' [) G. Y) @) {
//人名移动( A7 {$ y% E; J" O. A
function move(fbox, tbox) {( A, w9 M/ J& e  F% Z4 e3 g& [8 Z
var arrfbox = new array();
6 F! _1 H' }% S, ~# L0 L& |+ t9 zvar arrtbox = new array();
9 f# ?/ s1 g. A0 j% ~' K* Svar arrlookup = new array();
* x7 n" L+ a+ [" _  \- |1 bvar i;
, H+ x( B7 P# b9 V" r8 G$ x$ ]) B$ pfor (i = 0; i < tbox.options.length; i++) {5 ], B9 |6 m) A9 Z# w! t$ g7 I
arrlookup[tbox.options.text] = tbox.options.value;
/ |( Z8 L8 G4 e$ H; darrtbox = tbox.options.text;
  j& n; _3 h+ J8 Q8 g}1 r& ?1 |5 W% T% [7 F% ~
var flength = 0;
, ?8 V* ]9 l3 F" B8 `- v( V0 K2 _var tlength = arrtbox.length;& W) g9 ]) X/ N4 ?5 B" h. J
for(i = 0; i < fbox.options.length; i++) {
/ U: r; V" C8 ^* m4 B4 k7 P7 Barrlookup[fbox.options.text] = fbox.options.value;  d$ W6 z$ @5 {& `
if (fbox.options.selected && fbox.options.value != "") {
) o6 {  M( j/ y% p8 I: b) G% barrtbox[tlength] = fbox.options.text;
. Z9 P- t6 ]/ btlength++;
/ Y0 p3 L2 j! L4 n! A+ o! w}
& N  c) _' k/ ^! @+ ?- y; aelse {& O) h3 I( a/ f0 z' {* J5 x+ B
arrfbox[flength] = fbox.options.text;
, f1 Z3 b; C7 t, T" e, ?2 \flength++;
- \( |) G, F% ?6 u9 N0 F }
: a6 U/ s& J, K; E# L$ M}& ^2 A- K; o& B9 _- u( [
arrfbox.sort();- p; I" G1 `8 \- R% x9 {8 ~
arrtbox.sort();; D* ]+ a& C3 c/ P

3 I3 [) w1 z) K9 q/ @6 j$ Xfbox.length = 0;$ N; p' @- j! g8 J
tbox.length = 0;; i# i; W3 [6 y& X' T1 x2 F0 H
var c;
$ l; ~' k2 u5 Gfor(c = 0; c < arrfbox.length; c++) {
: Y2 Q9 D6 F& t5 i) Gvar no = new option();' B, Z2 |. {$ K  e
no.value = arrlookup[arrfbox[c]];7 x4 A* l. X- T9 H
no.text = arrfbox[c];/ T0 g, |6 j7 A+ o9 k7 o/ @
fbox[c] = no;) N: \4 B; Y5 N/ z2 H9 ^; y0 X. o
}
8 z, X( Z% K. I) c* |for(c = 0; c < arrtbox.length; c++) {8 C) }4 Z; [4 S: N
var no = new option();1 i/ f7 ]/ r2 }  ~
no.value = arrlookup[arrtbox[c]];
6 z" x2 g1 y. i1 ?9 `no.text = arrtbox[c];
- O3 L6 L& M7 x1 F' v" n# vtbox[c] = no;
/ v! {, N: }) I; J }
, X! J' [( Z# V+ l2 g, F8 R5 O1 ^}
% @( y' d9 `0 U) S* y$ E; l2 q: v</script>; J  z; X" u6 X9 N; i" _, \$ ]
</body>+ x5 F7 F2 f2 O$ P- m

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

返回列表

jsp+javascript打造级连菜单

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

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