Board logo

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

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

<%@ page import="java.util.date,yava.fileapp.*,java.sql.*;"9 a# c3 X! _2 r- `6 S+ I, t
         c pageencoding="gb2312"
/ z4 C5 e! {# w8 |6 s% E& y%>
# C: q. V8 A) V. O; v. g- H<style>) m7 d9 A9 N2 A- e
.f9{ font-size:9pt; }
5 j* _% `6 b9 w* \; T6 b( r.bgc{ background-color:#aecaf9; color: #0033ff }. B' \/ b3 x: {7 X
.buttons{font-family:arial; font-size:13px; font-weight:bold; background-color:#6796e4; color:white; border-top: solid 2px #aacafb;" t4 l+ j8 v4 ]% T+ H
  border-bottom: solid 1px #4e7dc1;/ H+ s" C6 M% I1 X8 g' Y
  border-left: solid 1px #aecaf9;: O% M. y9 S, a9 a0 J
  border-right: solid 1px #5679bd;3 P9 r. Q+ y& p/ K  o+ V
  padding:1px;
  b* P# f6 ~( D# l7 ]; O. i+ J& g  margin:0px;}! k0 Y6 H6 I  x. a/ B: g
</style>
" q" k6 K/ @0 ~+ K- j* C<script language="javascript">+ K. U  \/ v# |  ]- H( E6 d. }
<!--5 N9 G# Y9 V7 ?! m. `9 r
function rv()
' J7 N1 c* A, R{
! w& D, A! X; d  B* `  var val="";
& g" J1 T' D# l9 M( T% }9 g  for(i=0;i<combo_box.list2.length;i++){
7 G( h5 b# X$ q0 @% g& M; U7 D! W   val+=","+combo_box.list2.value;
2 @8 N! d; F" S1 _9 g( p  }
. p$ L) A! C' H  if(val.charat(0)==","){
: C; }" @7 X# P4 H6 q8 `, g% Z   val=val.substr(1,val.length);2 m. _9 d4 ?. C' s- U
  }: ^0 Y5 P) c8 P  j. n& |8 t
  opener.form1.frecname.value=val;
- ]) G  d5 ]/ v) P4 w" g3 k0 B  self.close();, L; D+ D3 y) X# W( X) x: r, @
}; [5 V3 z. n: q
//-->
# p6 F$ |4 F9 |; o7 c) }$ A* c</script>1 V8 m: p1 A0 Q3 ^1 I& H8 U* P/ j
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
$ N% S7 K. J6 Z1 h' a0 R3 i# w<jsp:usebean id="user" scope="session" class="yava.fileapp.userbean" />7 q4 b: ?# @- x! h( k! c
<%
$ \/ Z( V1 {1 v7 q1 I4 I* N  cdatasource ds=new cdatasource();  //数据联结bean实例+ `* j6 j9 V; B! ^5 P- O' b
  java.sql.connection conn=ds.getconnection();2 |6 e' p, v+ |" u3 n6 Y
  java.sql.statement stmt=null;0 r. P! n- K2 ?& X# k* X3 N$ M
  java.sql.resultset rs=null;+ R' {- W) N# v( ~. x
  cdatacheck dc=new cdatacheck();
  a* V& x  H/ o%>  L( G- W+ j6 `5 N# |8 s* f2 c3 O
<%. G/ E* d" v6 P
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";
3 K8 r, _: o% M1 Wstmt=conn.createstatement();  l) l' V& s6 Q* T* T
rs=stmt.executequery(sqlu);
3 E) z/ b. `! Y4 w%>" o2 o9 M9 [3 V: \4 B* s
<script language='javascript'>
/ i! R/ w) c' c' X/ E9 \) w6 v, d: Qarr = new array();
7 |, a* c; |: d<%  int temp=0;5 d! l' D/ b' p$ X+ p
while(rs.next())3 r/ k) X* t. D/ p2 x
{) L4 L! T  ]) C' _7 ?4 P/ `
%>
1 o7 Z5 ]+ o7 x3 z/ aarr[<%=temp%>]=new array("<%=rs.getstring("fname")%>","<%=rs.getstring("fdept")%>");
* c  i2 F) g' z<%
! b; u- j; k1 ~( m& K1 d. {" O  M9 itemp = temp + 1;; }9 Y9 v3 J. b3 A$ {
}5 p. ]4 {+ f- |  w6 T* X1 D$ F: K
%>1 N$ J+ ~% a+ |
temp=<%=temp%>;! O# n2 y& V9 `- K& S
function changelocation(id){ 2 T& ^! w+ C0 x
document.combo_box.city.length=0; //初始化第2级菜单的长度,下标从0开始
, M  l- R/ E, _5 b; nvar i = 0; 5 u' L1 y6 C; m+ A* V* V$ Z) _
document.combo_box.city.options[0]=new option('-------','');
; R3 |, |& V- t! Z; a  }8 @+ gfor(i=0;i<temp;i++){
, ~; ]1 F# \" M/ tif(arr[1]==id){//如果相等,证明在第2级里面有输入第1级组织的子集,arr[总数目][部门]
( B" J& D1 T5 a  y4 @, N' Zdocument.combo_box.city.options[document.combo_box.city.length] = new option(arr[0], arr[0]); : X" B5 z1 Y0 q$ v8 [
}
# O6 F3 [$ O5 B' N. H. k' D5 C' M$ ]+ A}
( `, i# m* U7 T} 2 O2 L( V, m  U, h$ D9 b' Z
</script>5 t0 ?9 t% w5 {% x- ^# y. z8 \6 c3 b

& }5 g$ o1 j& C2 ~1 P! B& Q  ^<form name="combo_box">8 q& Z- Z" S' j
<table border="0" cellspacing="0" cellpadding="0" height="210" width="59">
6 w; ?3 j! G$ m. e/ |, I7 k  <tr height="24">
  [1 E* m1 x8 o, J- a) X8 X7 s3 t    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>部门选择</font></td>% p  l, E% }8 q0 c' A, y9 G% K
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>人名选择</font></td>
$ I; R+ A& L' b/ L    <td bgcolor="#336699" class="buttons" align=center nowrap><font color=#ffffff>添加/移除</font></td>+ U9 y4 {% g; c3 i( Y7 k% |
    <td bgcolor="#336699" class="buttons" align=center><font color=#ffffff>最终人</font></td>6 r$ i* {; Q3 {$ {' ]) B3 F( T
  </tr>3 L3 g$ C. v. z" w1 y) k
  <tr> 2 \+ F  B) k4 k. X
    <td>, M8 w2 E  F: g6 I$ T9 Z
  <select multiple id=prov name="prov"    style="width:150;height:200" class="bgc">% P, Z+ z$ B. m8 [9 P1 w
  <option value="0">请选择部门 ---></option>
: H8 C9 m3 k+ V* F! v" D<%2 L% v- g: W; t- A( B& l& O! w  v
    string sqld="select * from tdept";& s' z4 u. o8 I/ o3 l
stmt=conn.createstatement();
% u2 `+ D; ?" x" W6 T: [rs=stmt.executequery(sqld);
$ D( r' {% Z! W5 Ewhile(rs.next())
! z. n1 ]) H6 `3 [{& a8 V+ X5 m5 [- K' m  A4 Z
%>" e5 A4 j# C" c6 i* L1 ?, i
  <option name="<%=rs.getstring("fno")%>"><%=rs.getstring("fname")%></option>
% R  E- {; \3 ]1 _<%6 D& R' |( p5 D' V( K
}: v5 ]  Y: G+ S9 N5 ]
%>
3 e) ~/ o3 x1 X& q; ^! N  </select>
  w  ~$ j2 t6 s) w6 K* I; I( J2 Q</td>
! X/ s* L# |* Y& `4 |# Z8 o    <td>
% N1 _1 z/ H5 \- N& b  <select multiple id=city style="width:150;height:200" class="bgc">
- F- D. V  ?/ }3 U% l4 e5 A  </select>9 i/ W  ?* U& i" T
</td>
! @& P2 ~  Q5 z* B    <td nowrap align="center" class="bgc">' j" m/ S" b# X9 r* K  j0 V; h
  <input type="button"  value="<<" class="buttons">9 Y1 o# [" d8 _% w9 j
  <input type="button"  value=">>" class="buttons">
' g# ~8 N- r9 o6 w4 r</td>2 n) P$ g: D' d" L( J
    <td>% k/ `) Y7 }  f9 |3 }
  <select multiple size="10" name="list2" style="width:150;height:200" class="bgc">, l$ |" \; P) ~4 [! X3 j4 O; J
  </select>( j8 ^# z# q$ X1 N! }
</td>
5 E8 e  g/ W' ~* n( E6 z) Q6 _4 b) m  </tr>' o$ u+ q: U6 \, m( e" \+ _1 [& X
    <tr class="bgc"> % D4 G# d. r/ j: `
    <td colspan="4" align="center"><input type="button" name="button1" class="buttons" value="选好了!" ></td>0 c, q! X2 v* `
  </tr>' L9 q: @' b( W0 s! I
</table>
+ q% \' {8 J, c: o1 N0 H) j</form>
, h+ ^" Q- [, Q: c6 }& T$ k8 ?& T- h1 F<script language="javascript">4 j$ x* L+ [8 u
//人名移动# H9 p2 ]" r9 w* d9 S" q
function move(fbox, tbox) {0 q8 s" r: T5 C; V8 R7 s
var arrfbox = new array();
# k# v: B1 W: p/ H, V3 [+ b' {: Yvar arrtbox = new array();/ {* O3 Z. E" a& i* [* p
var arrlookup = new array();7 z, e7 I  h! B- x& {& m# W
var i;' g+ N# Z5 u! x+ E
for (i = 0; i < tbox.options.length; i++) {
# q2 F) K2 M, I* D" L! a2 |% yarrlookup[tbox.options.text] = tbox.options.value;
  l% r) _' A2 u! \3 v6 barrtbox = tbox.options.text;
! s  D! k7 ^! M+ S}  t1 z0 i. I" ~
var flength = 0;6 U( M6 E8 U5 g# U
var tlength = arrtbox.length;
& p+ z8 g* B$ m9 A5 i: d$ j6 ofor(i = 0; i < fbox.options.length; i++) {
- \" U6 Z- t. }; X% z5 c1 Yarrlookup[fbox.options.text] = fbox.options.value;0 p" o9 M* c4 Z0 h: e7 {
if (fbox.options.selected && fbox.options.value != "") {
4 k1 x& f& C) {5 x9 I5 ~& x4 D& larrtbox[tlength] = fbox.options.text;2 m( O" }* |) c$ `" @5 L9 Y
tlength++;' L" f/ A" e7 t' m9 r) V8 u
}3 C# t6 n8 g: Q: X
else {9 B! i6 t7 w! x% o
arrfbox[flength] = fbox.options.text;* C9 h5 F5 F9 w0 E+ [# J
flength++;5 {# S& z9 s& @8 Z; `
   }" u3 Z' Q3 E9 U9 B& c; @
}* v: W" h, R5 X. n/ @
arrfbox.sort();
% i- ^. ^- ?- y, P! c$ m7 d$ T# V8 xarrtbox.sort();: ?0 D) Q5 D; O( e0 c
8 e9 t. x6 b, K; ^( f5 |0 w
fbox.length = 0;. h( B3 l* q. A# l
tbox.length = 0;% y+ k2 h* E$ {5 c
var c;
1 e9 f( Q& F) M+ u8 f1 zfor(c = 0; c < arrfbox.length; c++) {2 D- E- m. t& D' W+ W
var no = new option();" y/ [. F: ~7 d7 H
no.value = arrlookup[arrfbox[c]];
* c4 c, N! n' eno.text = arrfbox[c];( p7 K" t( Y  B) C" v( ~3 a6 |* `
fbox[c] = no;
% I+ M% L6 ^8 h& A7 O* I}. U( R% l% B' c' x  N0 O/ S
for(c = 0; c < arrtbox.length; c++) {
- W4 h+ Z* r3 |. a) T! s8 svar no = new option();
7 \; T. \! C2 Z. B! ^$ k. Kno.value = arrlookup[arrtbox[c]];
: m* `2 R1 [; e) @no.text = arrtbox[c];# C' f# B3 W8 |1 Z
tbox[c] = no;
, I! @! z4 a$ N   }  G: ?% `, \, w6 t3 i+ c# Z
}
& T( w& t% \2 J/ \</script>
$ x- x; I* T# `3 x1 u</body>
6 {7 V# c* w7 ~" D4 x6 |4 r





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