jsp+javascript打造级连菜单

JSP

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"
      c pageencoding="gb2312"
%>
<style>
.f9{ font-size:9pt; }+ G& J, ^" n, S7 J$ f# I8 @/ {
.bgc{ background-color:#aecaf9; color: #0033ff }4 ]5 p3 K5 M4 W
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;/ H0 l% p' i* V5 h: d: k
  border-bottom: solid 1px #4e7dc1;& K( Z3 n- r& E( @6 \& O
  border-left: solid 1px #aecaf9;( e( |7 j9 o: n; \( `
  border-right: solid 1px #5679bd;
  padding:1px;
  margin:0px;}
</style>7 i, P. I# ]  l3 H" x
<script language="javascript">
3 u4 c# m) s; g1 `$ j# K
</script>
# N; A+ b% a& v<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">. ?6 p9 R" i) k3 U2 Y' L
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />8 E/ N& ?! ]' |: ~. }
<%' P" S/ ?- B6 R! Y
  cdatasource ds=new cdatasource();  //数据联结bean实例
' v3 J9 w! T- L6 R; Q  java.sql.connection conn=ds.getconnection();
" J5 [: k0 V, ~5 V8 E9 S  V" {4 t  java.sql.statement stmt=null;
" R; L1 V+ c. e  java.sql.resultset rs=null;
7 t% ]/ M  ?+ t9 I  cdatacheck dc=new cdatacheck();
* i! }6 u; ~+ l%>, j2 ~: `. o! |. {' q0 s( H6 j
<%7 F' G1 L- }/ {$ j8 R$ ]9 S8 \7 {4 X
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";
9 e$ Z( h- T. x9 Y" L; jstmt=conn.createstatement();
7 }$ e$ }! F& [4 k# r; E5 Krs=stmt.executequery(sqlu);* J7 T& O4 u+ b/ V1 c: X8 w$ c
%>
1 R' w7 U5 }$ j<script language='javascript'>8 a+ p1 t; d5 w4 m0 ?
arr = new array();+ d% t  v7 ~) }* }0 I- s  j3 R
<%  int temp=0;
while(rs.next())
" R9 y; h" Y. h4 y1 _1 H7 N0 r{) G2 D  \  [# y/ {* Q9 U
%>. P+ U2 N! }# w! T" H2 W
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
: K7 t* T  j( F& t<%
) U1 g  G/ c8 {7 _9 M6 {temp = temp + 1;
. ~: l  d5 x! [( T) ?}
5 W. k+ C1 d9 h, Y- \. Z1 Y%>
* f( G* l- e, I0 O, A( |; htemp=<%=temp%>;
" r5 w! U3 Q9 Mfunction changelocation(id){ ; f' G8 s5 J+ }
document.combo_box.city.length=0; //初始化第2级菜单的长度，下标从0开始
0 ?( i5 w8 B  A3 [; ~! Vvar i = 0; # [2 ^  p; o8 A% o' M% O
document.combo_box.city.options[0]=new option('-------','');   v: S$ q+ h- J, v, t* f- U
for(i=0;i<temp;i++){ $ x- ]+ Y5 b# L4 P! ~8 f
if(arr[1]==id){//如果相等，证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
/ b$ H0 M' d+ Z+ Jdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
& C+ o& t4 M/ }( q' D+ ?} $ t1 J+ t4 U1 K6 u; n
}
5 \  z0 J# I% D/ w' p. x} 5 n9 {5 W) v& }# C
</script># ^1 {4 [! w/ `( |, }6 \1 c2 O
" Q. a, t& Q5 k/ L
<form name="combo_box">
- S1 t; C: M& T$ a3 ]<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
* v+ Q) C' z/ G% H/ ~* E/ z  <tr height="24">/ v- |* G3 M( M- ?& r) Y1 v
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>. V0 P8 ^0 M1 R. {8 W& g: @
<td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>' a  ]4 M$ Z9 q2 G7 C+ _# W$ H
<td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
" P8 e; I; e3 R- T8 {9 Q& t <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
$ e2 d1 H5 e1 N1 A  </tr>) n3 n# b( J1 }# X0 \9 O
  <tr>
0 v9 R6 g: v$ ] <td>
- u; h; @2 R3 h  <select multiple id=prov name="prov" style="width:150;height:200" class="bgc">
0 F8 ]  U) r: |9 J# e  <option value="0">请选择部门 ---></option>( v7 M4 T4 U# m0 K  y1 L
<%
! |3 d& O8 _5 q7 A: A$ n string sqld="select * from tdept";
. ~  r; _! p; ^5 f6 c$ d2 Pstmt=conn.createstatement();
+ }( u4 r9 k' r: j* x& Grs=stmt.executequery(sqld);! Q4 _. J5 A" e) O
while(rs.next())
# ^0 t1 E* f7 {/ O; Z{
# h: z, P* c1 M( I/ V%>* U, F5 m# }! S& B
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>2 e' O" o" J9 j
<%$ F# j, K4 z* w1 t/ D- i
}
: [* Z; U9 p6 D- N8 Y4 F%>
  i2 M& P2 `$ ?- z5 Q& z  </select>
- N9 P- L8 d2 b1 I7 x</td>2 _* m9 ^6 \& h  F
<td>
' X4 T. [* v  G, L+ D; d  <select multiple id=city style="width:150;height:200" class="bgc">
3 K( G) W* c  I7 Q# N2 k; Y  </select>$ a) ~" V- y+ H( ^' E" V
</td>7 ^( O* }! V, B- Z0 |( D
<td nowrap align="center" class="bgc">: x3 I  J8 S$ C& |
  <input type="button"  value="<<" class="buttons">
, M; W6 Y0 a3 h# w2 h3 z  <input type="button"  value=">>" class="buttons">8 M; B2 Q! E- J8 k, B
</td>
' r, y6 B8 Y8 \* M" x9 k2 f6 Y <td>
6 `, i; ^4 n- ~  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">
5 R1 c- ?# @5 c6 N# G0 h  </select>
  x4 _8 J/ G! Z5 A) R</td>
! M) p& b) g9 j& O! v$ W  </tr>  O$ `( o3 z  i$ y; u' Y
<tr class="bgc">
) l( r. Q# `. k <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了！" ></td>2 t: X, d1 _5 l. M+ `" x$ }
  </tr>8 h1 h& B1 T% Z/ [) I; k
</table>
$ B) n- J4 V6 h2 U. e' H8 u</form>: f% _2 Z2 G4 `
<script language="javascript">3 U+ [0 _/ i% G" d: Z/ j
//人名移动% [1 W' o% ^% t1 n# C/ Z  E
function move(fbox, tbox) {
! V/ `2 |6 _; ]- L5 xvar arrfbox = new array();6 \: d2 F! ]& b2 `1 l: P8 j1 c
var arrtbox = new array();
7 \  y8 S* l- T6 X8 Y2 Bvar arrlookup = new array();
3 Y! _9 X7 h* I1 [" q- Uvar i;
' Q4 u0 {. n7 _6 I4 a+ O& gfor (i = 0; i < tbox.options.length; i++) {
# X  z5 z7 t- |5 h" k% M& T, oarrlookup[tbox.options.text] = tbox.options.value;. q8 K. A; m. ]2 S
arrtbox = tbox.options.text;
1 ^0 {5 \/ C' P# R}
3 K& V- F6 e. c$ \, Mvar flength = 0;
" S1 [6 ~: L/ ^# @' O2 E0 bvar tlength = arrtbox.length;
8 E( S/ x2 ]/ z* Mfor(i = 0; i < fbox.options.length; i++) {
9 y( A- {8 v6 B8 x/ D. V( a3 c4 farrlookup[fbox.options.text] = fbox.options.value;. t, z8 i. F. z( n; [$ q
if (fbox.options.selected && fbox.options.value != "") {, D5 X) M) Z" u0 q4 V8 p' g, [4 j
arrtbox[tlength] = fbox.options.text;
" r: Q" o1 A) p* W) [9 {9 etlength++;
! S, H/ K, P- v* m. P2 x8 W}1 w6 u" ?: D( P+ Q; G: s
else {
9 s+ \5 u/ o2 s( |arrfbox[flength] = fbox.options.text;
. j' y. D2 e+ dflength++;
/ K- I/ l3 L2 Y! d7 v }$ b/ r2 i0 ^! y$ J$ q1 @0 y# s
}6 Q+ I4 J* F! U, ]( |' d
arrfbox.sort();' U  h/ R2 A/ t  k- u4 \
arrtbox.sort();! `. B& T1 z6 W- a- X& H5 S7 M
; |0 |8 X6 [* `% S* w
fbox.length = 0;% e/ |1 O% J  V! Z* f- w
tbox.length = 0;' {( D: `6 G" J0 _7 J
var c;& _0 Q, _; U+ U8 b/ o0 m1 H" b
for(c = 0; c < arrfbox.length; c++) {
: m$ s/ B# m; O' ?% G/ o3 f1 zvar no = new option();
% J6 T! k8 G. m. }: ano.value = arrlookup[arrfbox[c]];) q5 J7 f+ V" A0 q1 V/ V
no.text = arrfbox[c];
. y0 h4 e' A) x/ t7 Ofbox[c] = no;' i; m$ u/ ^" J5 V- l. I+ [1 @
}
; k3 B% n) z, a7 \: W# a# e2 ?* Vfor(c = 0; c < arrtbox.length; c++) {
0 O' r+ k6 M9 R1 Pvar no = new option();
% m# R0 ?2 |8 @no.value = arrlookup[arrtbox[c]];
( ?) q# p. y. K  ano.text = arrtbox[c];% M# i# T7 j- p* B( Z& C
tbox[c] = no;: O. e! B, Z, N& F2 |4 c7 p
}4 A; T7 K3 U4 n$ E8 y
}/ \/ L" G0 g/ @- V% W9 H
</script>
3 i% y4 `: n1 h) f0 i& B2 h  X</body>8 g' F/ v% e  h5 X) p. t+ M

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

返回列表

jsp+javascript打造级连菜单

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

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