jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"% T8 A0 g; O. g
      c pageencoding="gb2312"
%>' `) {6 d; _8 o& y% o; I
<style>
.f9{ font-size:9pt; }
.bgc{ background-color:#aecaf9; color: #0033ff }; Q- _; b, F6 H: y* I5 s
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;5 w' ^! B( v$ Q# }" x+ P
  border-bottom: solid 1px #4e7dc1;
  border-left: solid 1px #aecaf9;
  border-right: solid 1px #5679bd;5 v$ u; c" O4 {3 S: j% R  l7 ?
  padding:1px;" S7 M# U# a' z; J' K0 S1 y' B
  margin:0px;}
</style>
<script language="javascript">
$ z3 c5 p/ m* O
</script>
+ `, j: q- N8 {5 N* e<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
, t1 _) E" W5 e, _7 \<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />, H" R- h$ S* E4 X: c/ d' c
<%! r; \3 P' r1 ?0 S" I' P
  cdatasource ds=new cdatasource();  //数据联结bean实例$ |1 s/ E6 Z* s- `
  java.sql.connection conn=ds.getconnection();$ K9 a, n/ j+ c
  java.sql.statement stmt=null;' h" d; c8 |- X" d
  java.sql.resultset rs=null;
! `$ \" ^2 U& S  cdatacheck dc=new cdatacheck();
" a: ]! v7 v6 C5 h2 P3 X%>) e! u) Q. j+ \
<%2 C4 m2 f5 C8 Y& B+ W
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";
( P$ Z- }3 V3 r$ tstmt=conn.createstatement();
rs=stmt.executequery(sqlu);
: i, F- q. B" U7 t, b%>  `& A9 c+ \) A+ v' E
<script language='javascript'>
% v& p# j; x( Q( d* S. P0 aarr = new array();5 ^  x9 w# m+ r' D
<%  int temp=0;- i* R: ^8 b+ x# M1 Y
while(rs.next())# A4 R4 y' d+ t2 f3 ?, s7 t1 a
{
! p1 ^! [6 z+ `$ N%>0 U8 _6 ~5 C0 T. j: M$ O
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
4 U; L+ p4 ~7 C7 ]<%) x% G/ [& K# g. B2 c' b* u
temp = temp + 1;
: |+ F6 `- {: [0 h  K}
/ t6 w. L  I3 u8 K7 I%>
/ b* r; \- Z4 Ptemp=<%=temp%>;
- G& r. K3 Y. T( F" A( x2 W( ~! `; Bfunction changelocation(id){ " ?' i! N9 z0 a
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
* P# f/ ~' n4 E, V$ N; mvar i = 0;
9 p! r" E  f4 ^& r7 i* K0 \document.combo_box.city.options[0]=new option('-------','');
5 ~5 {- Q4 d) I# ofor(i=0;i<temp;i++){ 4 V8 W2 X  J' {/ E! Y4 c5 V
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] & c6 G" |. o+ q) C$ C) B5 f- T8 e
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
4 U  l7 u0 ]" e- F) E; M7 Q( |  B} " J4 Z/ A- S4 a9 N
} ' Y+ G5 l5 y6 D# d
} 3 U3 q- D# G* {9 d: r
</script>
" r0 d) \1 @& B+ C) |$ z: B0 R0 A# Q  f+ {) R
<form name="combo_box">
& i; X+ D- _/ b) I# `<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">3 ~. z# n1 c9 j+ ?$ Z- }5 ?/ y
  <tr height="24">
1 _! v/ n0 S2 q <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
  T' B& {+ ?( m) J <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
7 e9 |& {& s. w: N4 q5 ~' J <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
" s0 j/ J4 e5 c$ B <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td># V1 K2 I; {4 }$ @8 h" m
  </tr>- J0 d" s2 m' a1 a5 V$ H
  <tr> 7 N5 Y  d. e& d& t/ e
<td>
- u7 Y, ^+ t( U% g  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">! p! o0 T+ \4 r% G$ i6 ?
  <option value="0">请选择部门 ---></option>7 ^: y" D% c1 m  g" z. X, s
<%
/ ^0 u' g# H5 Q0 Q- p- A1 u8 j- E string sqld="select * from tdept";9 \) k- p- M; D
stmt=conn.createstatement();# @( a# Q! ~# ?7 [  H* T
rs=stmt.executequery(sqld);
/ g7 h' r) @8 Jwhile(rs.next())
8 x# |9 O' N; Q, P4 p# {8 s{: y* L" S* r. F  D7 _
%>, W% T. ^, V1 I6 y
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>$ [3 O1 K6 p$ Y/ p8 ^1 y' p2 ^- U
<%- t1 S; v+ K. E* X: q
}
  i& B& R/ H7 S%>
7 f! s! P& O4 J) H" ^  </select>5 C+ V' R( \0 O# d. U! z) j7 o1 R
</td>, ?% p" {; X( g/ Q( d( m
<td>
" D+ Q  j" k$ g# ]- }4 k" H  <select multiple id=city style="width:150;height:200" class="bgc">- U7 b# d$ c- {4 t7 h/ l3 j
  </select>" i$ {( \! ~/ l( M+ ]6 z
</td>, H2 [! h- I2 U
<td nowrap align="center" class="bgc">$ y  m1 x7 |$ Z- I3 t2 g
  <input type="button"  value="<<" class="buttons">
3 N' I( s' `/ p3 N1 B4 X2 g9 x9 H! W' c  <input type="button"  value=">>" class="buttons">
& ?& y% ?5 Z' ]( j$ l- X5 p/ g& H</td>
: V6 j; s4 \; r0 f; d/ [ <td>" r' }1 q$ `& l, p& D
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
3 F/ c' Q( E/ p8 \+ ]" `  </select>
1 C8 h5 V& u( J. [" M0 u</td>
0 r$ s; N. d% I: c8 Y- W! U  </tr>+ I' R: D4 ?  C1 L  m# W
<tr class="bgc"> " v* C- y  X0 P- P+ V
<td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>
0 v" E' L4 T; T/ Y8 }& b) h  </tr>. o1 J3 l; o; C( B. N* A: a
</table>
% E+ J# ]& j' H& ^</form>4 N/ G8 G5 v2 z$ L8 P$ b. H! F
<script language="javascript">( }7 P4 L8 N* E9 \
//人名移动' h$ J- [: u, V8 j4 Q
function move(fbox, tbox) {, K# D! ^, M* o4 R
var arrfbox = new array();. f% j0 H- f- G# v
var arrtbox = new array();' s! T( j; N* A1 r4 s2 ^- `
var arrlookup = new array();/ i# ^+ o6 @9 |: g6 Y
var i;8 D. B: \/ V0 j2 C! k0 j# {" W
for (i = 0; i < tbox.options.length; i++) {. C, F: Z! ^' C6 @8 K: f9 _9 f! Q) n
arrlookup[tbox.options.text] = tbox.options.value;
, C) F( s2 B& [arrtbox = tbox.options.text;
& d# |' A2 G8 c& Z# X  h% E}# A( I% u9 A9 t$ X0 m1 i
var flength = 0;+ Z! t/ M8 O8 `- d
var tlength = arrtbox.length;
5 A9 @7 C$ a6 S) p. {' e: r1 K& Cfor(i = 0; i < fbox.options.length; i++) {
  j' B4 C% l# d; }2 Z' yarrlookup[fbox.options.text] = fbox.options.value;
0 @( x7 l0 ?9 A) y& }* }4 k7 ^if (fbox.options.selected && fbox.options.value != "") {
2 R) y+ O  \% L# `" U' ^arrtbox[tlength] = fbox.options.text;# ^" t. {; E* y6 C. `4 X9 C. m
tlength++;, ^1 O8 P! [: |" Z) a3 Q/ s0 Q9 [/ }
}
! c. T5 J# q  a# O/ Y7 F( `, @else {, `" b, y# ]0 u1 j( B
arrfbox[flength] = fbox.options.text;% @( r% {/ s8 C
flength++;
% b0 d% N( e' d% Y8 A5 g, d }6 K9 Y' M; ^" w- ~; ^. [
}
5 a5 L7 x2 G0 o6 ^/ b  W9 Sarrfbox.sort();
. K% v, n  Y: V8 `2 M) I4 [arrtbox.sort();
; M1 y. g7 ?, J! f* I
4 H+ m; P4 H0 k7 ofbox.length = 0;
" |4 j- R, j3 P1 Ytbox.length = 0;
/ T4 E- o* x1 o2 l) z- ?  xvar c;/ a' a  S, E1 O2 I( @
for(c = 0; c < arrfbox.length; c++) {+ R7 J! O, c/ ?: p. Q
var no = new option();! D9 V8 P! J  F( ^7 o; \5 i
no.value = arrlookup[arrfbox[c]];' o& j) @7 G3 M/ Y. Q
no.text = arrfbox[c];  K, u% T5 U/ g
fbox[c] = no;9 k* N( L" L0 _/ ]& Z0 L* L
}
$ g" F/ o1 e$ xfor(c = 0; c < arrtbox.length; c++) {
  I" f, H3 n3 B7 N( Q  ?7 cvar no = new option();
. V3 V  P8 n: h. Ano.value = arrlookup[arrtbox[c]];8 R, x- c2 x9 G/ h3 J
no.text = arrtbox[c];: w" m) Y- a, w
tbox[c] = no;
" c" n. h# C( n- L }
0 F8 S+ M0 Q$ v+ Q}
3 w# l& G7 ?3 o7 ~' c$ N+ ?</script>8 l9 f' e5 N# E4 ~" m
</body>
; B* h7 w9 w5 d

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

返回列表

jsp+javascript打造级连菜单

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

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