Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"/ B/ H" O0 k; q# e: z/ A2 Y& A: A' f
         c pageencoding="gb2312"; \" J$ h+ |, M
%>! R0 x6 _. J2 G* Y* L8 U+ b- Z
<style>
5 U: [* F- F# O.f9{ font-size:9pt; }9 V" R  Y  @& ]& p' W" N3 K
.bgc{ background-color:#aecaf9; color: #0033ff }
" l: U/ z3 Q1 n3 E.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;: B7 c3 f' {; _9 U3 l
  border-bottom: solid 1px #4e7dc1;
  H, n, E$ ~( c9 F& z  border-left: solid 1px #aecaf9;
+ b1 ^2 ^9 I" H  border-right: solid 1px #5679bd;. Y, U% m9 Q3 a2 m8 a8 P
  padding:1px;: H% M! w; O# \
  margin:0px;}
+ b8 u, Z# Y! f: z* w; `! \7 g</style>$ q7 g  w+ ~2 _9 X( s
<script language="javascript">
+ ^* u$ A/ S2 B$ Q<!--
2 Y% D) X7 J2 O6 \% {) ofunction rv()1 ?- L1 w( q' |" {% a
{
% _9 x7 Y/ `, n  var val="";4 }! {! e: o/ f# g$ k. L
  for(i=0;i<combo_box.list2.length;i++){
% L" _, H/ V* ?# G   val+=","+combo_box.list2.value;$ j! K4 @% _9 N
  }! x) m1 B3 y* {+ h" ~7 e
  if(val.charat(0)==","){, \! H8 u+ n+ D8 t6 {, d8 O
   val=val.substr(1,val.length);! {9 W# F  f! [( @1 f3 O* d+ T
  }
4 n0 h+ r$ I6 [% k  opener.form1.frecname.value=val;6 L- z2 ^8 p7 H3 e9 m) a
  self.close();
9 R. o, H. O5 {! b  h: o+ @}
( Z, C( {4 _, `) r& @! O//-->
( n* F0 I7 M$ O</script>* y) g$ ^+ P! N4 {+ q/ L1 k! H
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
4 r' x" M8 P1 y9 t<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />
8 k; ^$ o3 W: F1 I5 {<%
' M! q0 B& {  j, ]- }8 D1 P$ f  cdatasource ds=new cdatasource();  //数据联结bean实例
! V& K5 x* s; s* L9 Q  java.sql.connection conn=ds.getconnection();$ F4 L0 d& H) ^
  java.sql.statement stmt=null;
% J, Y" K9 ~9 n2 u; v# g  java.sql.resultset rs=null;
. Q% n2 A" z5 l( H' o6 v" g  cdatacheck dc=new cdatacheck();
8 f7 b# |' x! N1 V+ R2 p%>
* r: B- b/ _. Q- b$ N<%9 E! z/ e4 z4 u6 t3 G* z. I
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";
) N/ @, W9 m# {* v! Z, Kstmt=conn.createstatement();3 ?4 Q/ P0 `- C9 D' s
rs=stmt.executequery(sqlu);7 s! F$ \. b! I+ T" b+ ~# j( j
%>
4 n* ]+ j. T. x<script language='javascript'>% b/ `  A) A* U3 I) K9 X
arr = new array();: e$ s; |, }0 X/ i
<%  int temp=0;
  `" Q2 d3 H3 swhile(rs.next())
; k3 z0 P% Y9 |" k# P( r$ z& q{
  M2 {- ]3 Y- b9 A$ z- J: S%>/ h/ @2 S9 G1 x  J# j3 r) D
arr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");: Y! ?4 ~" l/ j2 u
<%! C6 l/ n  J; t0 q/ h; t
temp = temp + 1;
9 R- A# f' B! F1 x- G}
* u. B9 P! t6 @3 |( Y0 K%>
8 {2 k6 l- c6 N% L- i4 Dtemp=<%=temp%>;. l' B- c" P: {- r+ T( G
function changelocation(id){
  {0 c4 {2 w  M# idocument.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始 9 n2 q4 Z) n) n  L
var i = 0; 9 e) u& N8 Z/ n* X& z6 P% R7 {) X& F
document.combo_box.city.options[0]=new option('-------',''); " G% R  I& h4 l2 ^
for(i=0;i<temp;i++){ 8 {% D. [7 ]  r& Z: N; ?" y2 |: I
if(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门] + B0 {) {- ]: Y0 o2 o( Q
document.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]);
: V9 M8 t. c4 L3 \# W" L}
8 L( D5 }, k$ }9 T% ?} + [/ R$ x0 a' m1 m+ l+ z9 V+ }
} # e& P% X( O. a( \" A; P0 J' G: g
</script>- }1 k$ `( r/ D0 Y4 m8 m" T  e; `

6 \7 G1 r/ y; |; N$ P  V<form name="combo_box">* s, ~" u  Y$ F9 @# X
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">! [: O6 D: L4 g8 Z6 L& v+ [
  <tr height="24">
, X: K0 Y6 J  O' H3 X    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>
; w: g$ X! O3 b) \; B) C5 `    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>5 M3 A! ~7 b4 z9 `3 j8 K/ a
    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>
5 O' a# l; a( {    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>
% A% l& R& W6 w2 Y# L7 Z  </tr>+ w* Z. E- @; E% M
  <tr> 8 P: A, {, G# W% @4 X9 n+ J
    <td>
! p- h' h( `0 ~2 F4 @# U' l3 Y  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">8 j, _) C) H. f0 u* p. T
  <option value="0">请选择部门 ---></option>; W# m6 ^, W, c& K1 \0 z2 z, \
<%
3 q7 l. P: V$ M9 i    string sqld="select * from tdept";' t, Z' S3 ?% g
stmt=conn.createstatement();
  h  S3 @8 H+ s7 Yrs=stmt.executequery(sqld);* y* ?; `# t, s# b3 i6 {5 D
while(rs.next())
4 C' h2 a, ?! e# X% o: e{1 D# X# M/ T9 D- b7 j
%>
/ y6 S% e) b4 F0 I$ ?5 I2 A  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>! K5 y: _" w% I, [
<%6 a0 ]- M8 k8 ]+ w
}5 X  |$ w, p) W3 v  O9 P
%> 2 K8 e/ z3 e# ^. ~* u
  </select>  {9 L' p8 r( f  e3 k  y7 W+ I
</td>
) `- F0 ^# I3 j' n7 X    <td>
5 W& A0 [( o+ @( M" f  <select multiple id=city style="width:150;height:200" class="bgc">
2 w3 g7 p3 d: y  </select>: s- ?3 o" q# m
</td>- k4 b. M; [7 I$ E
    <td nowrap align="center" class="bgc">) i( K! u+ p0 I* z9 x+ n' m1 e
  <input type="button"  value="<<" class="buttons">
5 g& A) ?3 F/ h3 `+ e+ {  <input type="button"  value=">>" class="buttons">
4 _/ o0 |- N; U6 {0 y" I</td>
, p9 a+ ]8 Y/ q) S0 ~    <td>% u" o8 k- w) t! t2 Y8 Q3 X. ]. ^
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">+ M7 U  m0 i' L: a' {
  </select>
# q$ S$ Y3 h. g& m( e# v</td>  H7 h5 e! N( ?
  </tr>
3 C# J! Q, \! s& v# {. Q7 @    <tr class="bgc">
( V# p3 {" n9 d    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>* U5 a( }1 ^. |. _; v3 r3 z+ m) c$ c
  </tr>
& t. D5 g* [6 I5 K/ r# n' w" A</table>. C# G! T- x! Z8 w
</form>
' m2 f* d' W! M: E# V4 i. V<script language="javascript">1 C0 a, J: w9 c0 h; N/ a6 D
//人名移动
9 m( p% _" B# sfunction move(fbox, tbox) {0 \# p6 x1 \3 h* m, U+ `; k* {
var arrfbox = new array();! a) b' B) }! x6 X& f
var arrtbox = new array();+ V, n' ^9 H; q. x' \: f6 L
var arrlookup = new array();0 H% e- B" M  [1 Z
var i;
! o/ D2 A5 r" L" P4 z# f# efor (i = 0; i < tbox.options.length; i++) {2 @1 o- i/ S. @+ L  s
arrlookup[tbox.options.text] = tbox.options.value;* A% x: f+ Z- W& |/ ]/ l8 l
arrtbox = tbox.options.text;
2 N+ q7 M  t  A/ `  x$ q}
4 X1 N0 ~. @5 Jvar flength = 0;
% T" Q( `5 ^/ b" i! v2 zvar tlength = arrtbox.length;
1 V! Z7 ^: E6 ?+ Vfor(i = 0; i < fbox.options.length; i++) {
% i- Q7 D3 P! H1 e! _arrlookup[fbox.options.text] = fbox.options.value;9 s0 k9 ~5 i6 s- Y9 F
if (fbox.options.selected && fbox.options.value != "") {$ S7 Z3 m# [7 ~1 f: I
arrtbox[tlength] = fbox.options.text;
, i3 e5 V4 [) H- stlength++;0 O7 s0 M1 Q( e5 C
}
- ?7 b0 B$ A" Z0 ?else {
  T. s* n$ W1 s; Y9 `! a- N& B. ?% garrfbox[flength] = fbox.options.text;/ t7 a8 @6 z9 o1 ?2 [
flength++;
! }* M' S; A6 y0 \   }5 B' \7 r/ C3 i( e
}
' F& T# Q/ e9 |* o* R6 A8 }arrfbox.sort();  R: D, R) A2 z. U
arrtbox.sort();/ D$ @% Q9 g2 f* b8 @

& D5 K# R8 u- x  ^) c- ^/ cfbox.length = 0;
& Z1 b# c  x% d* i! r5 Z$ }0 d/ R' Jtbox.length = 0;
0 X; G7 `9 F0 w0 Ivar c;% `% C5 W3 e2 z9 y  h7 ^% i! L
for(c = 0; c < arrfbox.length; c++) {
0 c2 ]+ O. ~* n) A0 ^3 Y* ?/ Bvar no = new option();! @0 A9 O! @7 [
no.value = arrlookup[arrfbox[c]];
) b# Y! K( `- @# i+ d8 Q+ {no.text = arrfbox[c];6 S. ]7 j6 k; @( |+ q7 g" v
fbox[c] = no;& r% I( k0 a+ L. N. L7 v
}( P* P; I4 F# Z7 \' \
for(c = 0; c < arrtbox.length; c++) {; |! t: L. ^% n; `; n
var no = new option();9 \/ H8 S5 X9 M" m
no.value = arrlookup[arrtbox[c]];
4 M! F1 a& g6 X8 d8 L" {+ uno.text = arrtbox[c];) \5 M  S2 {- ^( M/ [' |2 K
tbox[c] = no;5 b/ P  x+ `  a0 {) X9 ~& m# m
   }
  X/ r8 Z. P  ]9 u}" [& [+ t( [; o) P% a
</script>
/ `+ [( G% T0 A1 ]9 G</body>
' E7 @- w, \& x0 B. `





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