Board logo

标题: jsp+javascript打造级连菜单 [打印本页]

作者: admin    时间: 2007-12-5 17:43     标题: jsp+javascript打造级连菜单

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"1 M8 }5 X& ]6 C5 z
         c pageencoding="gb2312"
% T3 w' }, A  O; N%>
/ |9 ]& V- z! ~( n& u: D) g<style>
: B3 D5 X/ j, N! w.f9{ font-size:9pt; }8 k( J  ~2 d5 C
.bgc{ background-color:#aecaf9; color: #0033ff }% }& _1 o/ K0 g" M* E9 K
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;
) @3 ]9 N6 l2 X5 E  border-bottom: solid 1px #4e7dc1;
: o+ A/ z% a1 z* r( Q* ]- V8 V) P5 i  border-left: solid 1px #aecaf9;  e- I7 u  X1 L: i& |
  border-right: solid 1px #5679bd;; M0 G" G+ `" I
  padding:1px;( {7 |7 D2 n# x( \7 ?$ I
  margin:0px;}
5 G7 v+ F% X  f7 m- T" `6 B</style>
2 G/ e+ ?+ N8 _  t<script language="javascript"># y$ U( U2 V8 t; P" }9 w
<!--; ^0 V5 X* z0 _# j6 i; g! \
function rv()$ C7 J" E( H% l. |7 }
{+ ^0 o* m% {5 X, S! Z8 K  k( Y
  var val="";
0 [/ A% e9 d" J  {4 s: I0 z9 d  for(i=0;i<combo_box.list2.length;i++){
. c) ]. n' Z- l+ [   val+=","+combo_box.list2.value;1 a3 l) |( ]: O% `: R
  }
( o! I5 j8 p* n; y5 L0 N  if(val.charat(0)==","){
) ~# _2 T1 K& o! C2 s   val=val.substr(1,val.length);$ f4 a, E( u) V2 ]
  }
  M1 E; i% ], \. h5 m" ^  opener.form1.frecname.value=val;: o0 w2 O1 T( T4 i9 M  w" `
  self.close();
; U% x8 Q8 ~" o8 e  ~% X0 }}
4 P) k& b' k6 a) s. S0 }  D//-->2 G: A6 G& F* s2 ~2 G
</script>
3 T; @% y- q3 q8 i0 S<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
( J, p$ h7 h  B0 e<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" /># P$ ~/ J7 |' g  u
<%% H: x# T! u  x
  cdatasource ds=new cdatasource();  //数据联结bean实例
3 q" j) b, @! K) D; l  java.sql.connection conn=ds.getconnection();1 A) B1 F! V  S
  java.sql.statement stmt=null;  m& {7 a: u3 }: O# Z9 U. Q" a
  java.sql.resultset rs=null;
3 r7 Q9 L7 _6 n( ^3 p! L% t, G  cdatacheck dc=new cdatacheck();
7 [3 a  m  m! Q- n. g# p0 H" d%>% l) {' Q' u, e+ S0 {
<%
- c7 Y6 o( b0 rstring 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";
  ~3 q& i' q1 H% f" W, Vstmt=conn.createstatement();
6 m* J+ B# [# R# srs=stmt.executequery(sqlu);
( ]6 N- t6 h# ^( O" n% j& [: D+ ?%>. \+ [. V/ h3 t" R1 g( v
<script language='javascript'>. f) }$ O1 j4 t1 ^; u
arr = new array();
" p8 [6 o- |/ F! x<%  int temp=0;
5 b) N3 I. G2 j0 v5 N9 Lwhile(rs.next())
, ^  ?& j& r- h{
7 L: P/ J0 b4 k9 f* h%>* u" K( C2 x) {' |. i! ?
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");# M& Y2 j. |/ p' L/ |
<%
; }6 l2 P' n0 d7 \; j3 Z* gtemp = temp + 1;' |& y) G& q" r# |
}
# E" ?; R) A- ]! I; ?: W3 w%>
; {+ w1 X: ?2 b' vtemp=<%=temp%>;% p& q# }6 V/ v+ U6 M
function changelocation(id){ 5 O5 p' f2 N: b! R
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
4 b3 X( J) ~) a# h( \: e5 p3 Z' c7 Avar i = 0; ) }( ]! x: r: T" r
document.combo_box.city.options[0]=new option('-------','');
* F$ w6 H6 ~" E, efor(i=0;i<temp;i++){
2 p  E$ U- ?/ aif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] 5 Q1 z# s1 N  b
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); 3 Q2 y- W8 u! z( J! \
}
6 s9 ^8 w7 p% Q/ Q. A% Q} " ^3 a5 i0 m. d
} * ^. G4 k  R8 C) v' \$ P% |, \
</script>* L8 O! A3 u  B3 C; g( X$ ^( b6 O

; p% Z5 O! a$ |3 W7 ~<form name="combo_box">/ y9 c, s2 U0 W. `$ B% _% F
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
1 K1 x# T8 T( ]( {7 {$ t& E  <tr height="24">
- u* X  q& X1 I% Y- p( E    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>9 d; `8 m# e: [$ F3 r
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
% r" q+ A6 I- I$ ?% K+ v; ~    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
7 @, n% s/ N" @    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
! C" j, G( E3 f) J  k6 X( j; V  </tr>
0 D8 L& K; e% o+ q* m  <tr>
# Y6 N& l' w5 q* @* @  g/ C    <td>
. p1 `. @2 ?) P6 P  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">
5 G" t# q9 S$ X" ^3 p  <option value="0">请选择部门 ---></option>
3 [3 O* Y0 T5 T' i6 n<%
0 V; D: [6 i7 p# k! s0 S    string sqld="select * from tdept";' s& v2 M5 X2 T/ u4 g; }& q
stmt=conn.createstatement();
9 H8 M% E; w* r( v. vrs=stmt.executequery(sqld);# E* ?" a" I9 g7 u/ A
while(rs.next()), E  C) d7 m# h4 d3 Y# p9 A  q
{
+ W) Y+ x* G3 S6 X3 R+ Z) R- A+ Z%>
' s1 B* m- q& x( E& ^- H  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
$ v; a! {! q2 I5 m0 c4 R<%
7 L: e# b( v0 g# ^4 ^}
0 ~/ E" s5 s% H  Z# z3 K5 r%>
( r( _* |( l$ X! f: D& m2 x  </select>& x3 x& v) O" `
</td>
& Z# k7 T, `4 F, F, W# s7 k6 D    <td>
, L+ v: |4 o! F! A5 \1 z  <select multiple id=city style="width:150;height:200" class="bgc">
1 \: O3 j  _: ?  V" d  </select>
/ V/ O0 X1 i8 l8 p</td>
/ ]6 t% L! {  R. j% D0 P    <td nowrap align="center" class="bgc">( x- Z: c7 I8 F" L$ c( O
  <input type="button"  value="<<" class="buttons">4 _9 J8 e5 Z- G/ G( d3 J
  <input type="button"  value=">>" class="buttons">1 F4 f: n/ }6 i3 E  i" v
</td>
, ^$ T9 G4 }+ H; E) s! d: F9 v    <td>
6 F/ s! }5 Z$ `  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">3 P, k: J! I0 V  J+ L5 I  Q$ u7 n
  </select>
* {9 f3 o# M5 P$ w- D7 x, C1 i</td>
) b9 j0 e7 X2 f4 v  </tr>0 l6 e' d+ Q, F9 Z8 w2 X" z
    <tr class="bgc"> 9 \. [# Q4 d, j, H! k
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>! ^3 @! j. R9 ?; f
  </tr>
& M8 X$ A& R4 S; Y% w& e5 p</table>
, o1 s2 K! c2 V- Y</form>
7 G- u6 p, d- J+ ~3 Q<script language="javascript">) O' j4 b1 T! N# M# ]
//人名移动+ Z5 m+ k# f6 s0 @3 g# B+ q
function move(fbox, tbox) {4 P8 g8 }& i+ ^
var arrfbox = new array();
* T! ^9 w$ J7 b( e, z4 `+ P. l/ [var arrtbox = new array();5 E& Y# \7 i+ k# X; j- U
var arrlookup = new array();- T2 k$ D6 b$ w" j- u: C% z" B0 g
var i;
9 v/ i5 x3 q- ?1 \8 efor (i = 0; i < tbox.options.length; i++) {+ A% O& Z$ R, @; k
arrlookup[tbox.options.text] = tbox.options.value;
% V* I' C( Y2 p& p, Jarrtbox = tbox.options.text;
% A7 F* L2 m% |7 o3 E1 u+ i# e}
/ S: j9 J2 h# Q/ o& Kvar flength = 0;: @/ u0 W5 d1 E+ x+ H( S" {+ G
var tlength = arrtbox.length;( {! w* q1 k9 o7 Z- f
for(i = 0; i < fbox.options.length; i++) {, S0 F2 o2 `2 A. ?
arrlookup[fbox.options.text] = fbox.options.value;
5 ^- ?% z- T0 u; mif (fbox.options.selected && fbox.options.value != "") {8 g: l: C: T2 X) q4 j
arrtbox[tlength] = fbox.options.text;, N; a2 x# V( f/ u
tlength++;
! g0 r+ w) X4 @! v; |# S}
+ t, ~+ D: |9 Z5 v# C1 melse {
& t" I8 b' U* B3 b6 t* i& R1 a; x4 w; Warrfbox[flength] = fbox.options.text;
3 L6 x3 }% O9 Q" ?4 p! Uflength++;1 e9 Z* ~. U6 O
   }
+ T& S4 T+ f- e- Y( A2 Z4 F}7 U6 H1 P+ d( v
arrfbox.sort();
9 i6 g( q% b- [; M6 \arrtbox.sort();: s0 T. Y9 f& R" _- m: B

& N# G8 Q1 @# i, _7 gfbox.length = 0;
, d# a  k9 l  t% `tbox.length = 0;
7 L9 f9 R. u- s4 ?8 s  Xvar c;* c, G5 a  h: D  F( R5 T
for(c = 0; c < arrfbox.length; c++) {
* j/ i- x9 R& e% `- _var no = new option();/ ?  U9 [1 o1 M7 ?" Q' K2 F8 {
no.value = arrlookup[arrfbox[c]];" A: f( i1 v0 k6 A
no.text = arrfbox[c];
$ M# i9 p9 d& G6 l2 Cfbox[c] = no;# w+ d" T. H$ i: R  u. T1 g- K. ~
}
: y$ ]& w( Y# ^' m! R! [! Y4 ~for(c = 0; c < arrtbox.length; c++) {
1 Q8 p" g  z* [% wvar no = new option();8 ~9 V. ~$ h7 l7 s  {5 N
no.value = arrlookup[arrtbox[c]];7 P3 Y  I3 x, I5 a/ j$ E6 j
no.text = arrtbox[c];
  O; C- a, @" s! }tbox[c] = no;: L" N8 i; V. B5 L0 j% H) K
   }) B7 J4 w+ W- L: A! \
}: f2 @) d  L& Q; c4 D% ^
</script>7 ^/ Q1 ^" I+ M- ^. r' k
</body>2 K) Z" K3 W; J, J





欢迎光临 捌玖网络工作室 (http://89w.org/) Powered by Discuz! 7.2