Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"+ M2 r$ _6 T9 `& Z0 f7 b
         c pageencoding="gb2312"( p% H2 |' S8 B8 G
%>
) d+ G5 F! ~7 M<style>
2 g* m) S2 c9 l5 n.f9{ font-size:9pt; }
% m2 u' s) i5 ~& Y1 p.bgc{ background-color:#aecaf9; color: #0033ff }( p" ^9 I* g6 t6 M. U4 m; f
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;& M- v6 k) o8 m5 t  M& s7 K) E
  border-bottom: solid 1px #4e7dc1;
8 _1 Q" h" J! P. @) f  border-left: solid 1px #aecaf9;
' `7 ~3 T( V+ B" Z+ t( p  border-right: solid 1px #5679bd;8 d  @: b& Z# f- H, D
  padding:1px;
3 \- p' g0 x' r2 E1 ?  margin:0px;}9 a7 ~+ T$ t$ z& k
</style># q% @# o$ J8 n
<script language="javascript">
, Y6 i% n( C& N. n, S<!--
* t$ e" F8 X: `7 v! [+ w: n9 Bfunction rv()
6 c+ k& |4 i5 X8 ]  c3 [% P4 k{# @! b6 p( m* I: V9 s( j3 F
  var val="";/ J7 |+ t. N* C" Y: r" h/ V" g
  for(i=0;i<combo_box.list2.length;i++){. Q$ G, T9 \0 B+ ~- o
   val+=","+combo_box.list2.value;
! e/ J1 v' X' T6 G8 ~! r  }" I, V% a( K3 M0 ?2 n) c
  if(val.charat(0)==","){2 A( J4 _0 Q* g1 b( ]$ G) t: l
   val=val.substr(1,val.length);) x9 K. T( r% ?" Z  e% i" p7 {' c
  }: Q1 I! I/ _; c5 r4 O5 M7 F* j
  opener.form1.frecname.value=val;6 j$ T9 T8 r7 e: c% B' T# u
  self.close();2 J8 |8 \7 T: n" \2 y7 D
}' k& t: H; s9 y- d
//-->
9 l2 u5 `: Z. Z  s# p: e" [3 e4 _</script>4 N4 N" L! {) S' N8 M" J0 b7 T
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">" W% E- |2 h7 q  ^' F. X$ c
<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />6 |# S! O" R$ V  e& e+ v5 M
<%
2 r, M8 ?  u, Q7 ~" N  [" t  cdatasource ds=new cdatasource();  //数据联结bean实例  r; H) R: G. ^1 v8 ]! I
  java.sql.connection conn=ds.getconnection();! \( L0 `( {( ~$ Z* F8 b6 P4 @
  java.sql.statement stmt=null;
& A$ g& B, \7 J% j  java.sql.resultset rs=null;
3 a3 I/ ]2 o$ n8 B; D; S  cdatacheck dc=new cdatacheck();
, _+ K: t/ J  x2 W3 U%>
4 M+ e7 W; s& v$ T7 W* j<%
0 |3 K* ?  ]' g' p4 Z, astring 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";0 r/ z, o0 Z2 H0 X( D
stmt=conn.createstatement();
# G5 j1 l; c% O5 c  frs=stmt.executequery(sqlu);
7 N% ?% N. Q& A%>4 y% N) L$ L; \2 ?; D+ k4 T
<script language='javascript'>1 r$ C: y  o" Q! J7 {& b
arr = new array();
# Z/ c' R& V8 F8 e<%  int temp=0;
4 [$ l7 L; _) m4 \% iwhile(rs.next())
; U; s$ T! C2 q$ A$ S, {7 T- @3 [4 j{6 Z+ w6 `2 O. [4 X
%>
& |9 B+ p8 c- i- S  Farr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
. ?& T7 w7 ]9 W<%
0 H, F( s! p! |5 Z+ q7 F7 Itemp = temp + 1;2 \5 }$ c" }$ k  Q  Z
}' B# Y' R6 d1 a& m! t% o6 a
%>
9 G; l5 \" r! D0 d1 t' L( Qtemp=<%=temp%>;
9 k" t4 P8 ]/ w5 Nfunction changelocation(id){
" T" Q3 u0 W; b  _" |7 w0 Jdocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
% k! m5 r3 i! E' F# K2 {) wvar i = 0;
2 v& N9 ~, y9 ^" t6 `document.combo_box.city.options[0]=new option('-------','');
" Z: g4 J% s) A4 o; ofor(i=0;i<temp;i++){
3 P3 O) ^6 R# L1 c3 ?4 }if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] " |9 c+ X/ c, e1 d  B% N2 f
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); # S/ c# `$ ^6 `  @
} $ }0 y% l: ?* c2 c
}
2 k. a7 Q8 m; V* y} 2 u9 F6 \) y/ {: D0 C# `
</script>
1 [2 C& H: r" m: b8 v% u3 l2 a0 z0 y# w
<form name="combo_box">. W8 {# u  Z2 z. W$ M+ _7 Z
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
0 s% [2 Y  _  K. F' |7 I  <tr height="24">/ K  A6 k9 I# @3 c* n: R
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>) T: @5 j; z$ @8 \9 L
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
5 b; y6 o7 G4 v! m    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>0 }% A9 t7 B. z5 Q/ u
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>0 |6 L/ T1 Q3 I; s4 W
  </tr>
& H6 Q0 |( E1 J- x% R: v  <tr> ( Y- z5 H  Y6 Q: k2 b% O: U
    <td>
5 O" J8 L- ~  M  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">* q5 B. s6 S4 ]" a- k1 h
  <option value="0">请选择部门 ---></option>2 c  N. l$ j. q$ m5 l& g6 d- y' @
<%
% t1 z' ?) C: h$ V' I# |0 t4 g- E: v( x    string sqld="select * from tdept";
/ N2 m, i) p) k& E  hstmt=conn.createstatement();5 J# ]8 {, o+ u4 y* E4 V9 x7 P
rs=stmt.executequery(sqld);* G5 H# @( ~' ?. m
while(rs.next())( A" e5 M% ]# D/ }7 M% t3 _. |
{
. `0 q: L, i& z2 g' y3 M/ I%>, s9 P9 W$ j6 ~* g. x. w; q/ f
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
- }5 d( F  R2 ]/ g5 R2 z* g<%7 N" X+ n) A* k) c
}- [+ t; @4 y" t2 J0 G# \
%>
  N. Z% w- d& H9 M4 C: P  </select>
, Z+ V& u7 d5 h& Z; j( c7 \) o</td>
4 N0 e- ]# P( [& k. K7 o9 d    <td>5 O% v9 V) q) {
  <select multiple id=city style="width:150;height:200" class="bgc">
' a# J0 q# Q, @, Z- H5 s5 w  </select>& ^* D! X3 `3 b7 _" H3 v4 B* p
</td>1 o4 }, z5 {1 u$ {0 M  A
    <td nowrap align="center" class="bgc">* J, n5 s$ F2 L, m4 G+ |4 {, V4 a* T
  <input type="button"  value="<<" class="buttons">8 D) Y* m9 Y2 d1 J2 \9 g
  <input type="button"  value=">>" class="buttons">& F$ Y$ C+ \6 @  G- J
</td>; L8 K8 p! r+ m3 _  @! F: m
    <td>! A0 `" L' _" a4 z( h" f  {# a
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">( t9 d1 K; d2 t, Z* d
  </select>
& F8 r" _2 z( {4 i$ x</td>! u$ H+ t; I2 S7 C5 A0 i
  </tr>
8 H4 l. @' |: p1 k+ R5 k    <tr class="bgc"> + [; I: G$ Q7 X& {, v6 j- U+ B
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>
% N1 F6 X. ]3 O, B6 n  </tr>) `7 P3 N/ s: o0 |* D, }3 K7 O+ R
</table>6 O8 u$ K% ]0 k8 ^! q" c7 t4 w9 [
</form>
0 a4 u5 x8 L" Z& y3 x8 _& f<script language="javascript">
& [& E9 p( K! O//人名移动1 A* l1 B. [& [, }7 ]; J6 C# d
function move(fbox, tbox) {
. G* Q& S" c' N* k7 {( J9 i, lvar arrfbox = new array();
3 S" l+ p9 ~) o& L7 S  |' Jvar arrtbox = new array();2 c0 ]. H- o, P# P" A
var arrlookup = new array();
& @# {4 Q" z% r3 u. [0 bvar i;3 R; t( d0 ]- _7 N. O8 H
for (i = 0; i < tbox.options.length; i++) {
$ [( Q5 D! v6 Y/ U+ [8 warrlookup[tbox.options.text] = tbox.options.value;3 q- M: v, M+ a% h
arrtbox = tbox.options.text;
6 |$ x+ X0 i% r3 P: ?; e7 l  k}6 w- v% y, f; b5 l& k% D% J
var flength = 0;5 Z7 F7 T& s! n! S5 P* z, h9 a
var tlength = arrtbox.length;
  P, g& N) v1 Mfor(i = 0; i < fbox.options.length; i++) {* ~8 P  x+ y) j2 S
arrlookup[fbox.options.text] = fbox.options.value;7 h% N; M; ~% F6 g% G3 ]
if (fbox.options.selected && fbox.options.value != "") {
6 w! b/ a4 U7 y$ Q- i, K# \3 d: Uarrtbox[tlength] = fbox.options.text;0 H. G9 o0 t2 i
tlength++;! u; \, s7 I( h1 d' h4 I  h$ B* [
}- Y4 f1 a& i, m
else {8 m2 Q" F6 P" x" _
arrfbox[flength] = fbox.options.text;9 e! k2 _$ ?4 Q3 e
flength++;
- w7 d0 T: N9 G" y& C% b; i   }
+ [! b: c; _% d}9 Q7 l4 c; W$ w2 @9 L+ \/ F
arrfbox.sort();4 ^3 ]* a$ H7 ^8 B! t& t- U
arrtbox.sort();" f, K' R9 i* {5 i& s3 I2 M. {, F9 L
7 Z) x* m3 z/ `6 f2 |0 S
fbox.length = 0;
; b$ X) R8 R: l6 N0 x+ w+ gtbox.length = 0;" \- F# i' h* q
var c;; X. g, j( Y* U6 w# v# s
for(c = 0; c < arrfbox.length; c++) {& |6 c  n2 y  y" O7 L
var no = new option();+ c0 g5 C1 Q# T
no.value = arrlookup[arrfbox[c]];
& \% s1 }" N1 e+ a+ Mno.text = arrfbox[c];
( g0 d( H9 _& C& D" mfbox[c] = no;* Q8 k3 `6 q$ l6 }# O) F
}% }+ G2 r1 t7 v! \
for(c = 0; c < arrtbox.length; c++) {
4 }) `. Q$ ?$ o% u/ Y  W) Zvar no = new option();
7 e3 Z' P1 m0 m7 fno.value = arrlookup[arrtbox[c]];
1 s# O: X. h- _7 N, rno.text = arrtbox[c];
. D7 s% c: G- h' e: R6 A8 j- ztbox[c] = no;
9 H" H; s( P7 d  N* Z6 t" h   }
! G0 {) d/ g9 C5 Y}
# r5 u' _  t+ l* o</script>
" G1 L5 O# t7 t, ]</body>
/ b1 D. O/ x; U  w2 g+ `. K





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