使用ajaxtags实现菜单级连

<%@page contentType="text/html;charset=UTF-8" %>
<%@taglib uri="http://jakarta.apache.org/struts/tags-html" prefix="html"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>main</title>
<link href="${pageContext.request.contextPath}/css/main.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="${pageContext.request.contextPath}/js/prototype-1.4.0.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/scriptaculous.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/overlibmws.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/ajaxtags-1.2-beta2.js"></script>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/ajaxtags.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/displaytag.css" />
<script language="javascript">
var baseUrl = "${pageContext.request.contextPath}";
var currTimeT='FTD0311_SNPH_R';
var histT='FTD0322_SNP_C';
var fName='BRFL';
var currentTable=currTimeT;
var disPicUrl=baseUrl+'/qxxx/cache/images/'+currentTable+'/BRFL/';

</script>
<script src="${pageContext.request.contextPath}/js/comm.js" type="text/javascript"></script>
<script language="javascript">
window.onload=Page_Load;

function showHistory(flag)

if (flag==1)
{
<c:if test="${param.meeting != '1'}">
document.all.showHistoryYear.style.display = '';
document.all.showHistoryYearInfor.style.display = '';
document.all.showHistoryTypes.style.display='';
</c:if>
$('selectpic').value=2;
currentTable=histT;
disPicUrl=baseUrl+'/qxxx/cache/images/'+currentTable+'/BRFL/';
}
else
{
document.all.showHistoryYear.style.display = 'none';
document.all.showHistoryYearInfor.style.display = 'none';
document.all.showHistoryTypes.style.display='none';
$('selectpic').value=1;
currentTable=currTimeT;
disPicUrl=baseUrl+'/qxxx/cache/images/'+currentTable+'/BRFL/';
}
//alert(disPicUrl);
$('seltime').fireEvent("onchange");
}

function getPictList()
{
var retStr = "";
for (i=0;i<document.all["drpPicture"].options.length;i++)
{
if (retStr == "")
{
retStr = document.all["drpPicture"].options[i].value;
}
else
{
retStr = retStr + "," + document.all["drpPicture"].options[i].value;
}
}
return retStr;
}
</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td valign="top" height="100%">
    <table width="98%" border="0" cellpadding="0" cellspacing="0" class="table-space">
        <!-- 上弧 -->
<tr>
          <td height="7"> <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_top_left.gif" width="7" height="7"></td>
                <td background="${pageContext.request.contextPath}/images/table_top_bg.gif"><img src="${pageContext.request.contextPath}/images/spacer.gif" width="1" height="1"></td>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_top_right.gif" width="7" height="7"></td>
              </tr>
            </table>
            </td>
        </tr>
        <tr>
          <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <!-- 左直线 -->
<td width="1" bgcolor="B8B8B8"><img src="${pageContext.request.contextPath}/images/spacer.gif" width="1" height="1"></td>
                <td class="table-bg"><table width="100%" border="0" cellspacing="0" cellpadding="0">
                    <tr>
                      <td class="ititle">云图选择</td>
                    </tr>
                    <tr>
                      <td align="center">当前卫星:
                        <select name="seltime" id="seltime" style="width:86"><!-- onChange=showhistory()-->
                        <c:forEach var="scnm" items="${requestScope.scnmList}" >
                           <option value="${scnm.satcd}">${scnm.satnm}</option> 
                        </c:forEach>
                        </select>
                       </td>    
                    </tr>
                    <tr>
                      <td class="b1">
                      <input type="hidden" id="selectpic" name="selectpic" value="1" />
  <table width="100%" border="0" cellspacing="0" cellpadding="1">
  <tr><td width="18"><input id="selectpic1" type="radio" name="radiobutton" value="radiobutton" onClick="showHistory(0,this);" checked></td><td><label for="selectpic1" class="lbl">实时气象云图</label></td></tr>
  <tr><td><input id="selectpic2" type="radio" name="radiobutton" value="radiobutton" onClick="showHistory(1,this);"></td><td><label for="selectpic2" class="lbl">历史气象云图</label></td></tr>
                      <tr><td>&nbsp;</td><td><table width="100%" border="0" cellspacing="0" cellpadding="1"><tr><td width="18"><input id="radioButton12" type="radio" name="radioButton2" onClick="$('imgTyp').value=2019;$('seltime').fireEvent('onchange');" value="radiobutton" checked></td><td><label href="#" onClick="$('radioButton12').click();return false;" class="lbl2">红外云图</label></td></tr></table></td></tr>
                      <tr><td>&nbsp;</td><td><table width="100%" border="0" cellspacing="0" cellpadding="1"><tr><td width="18"><input id="radioButton13" type="radio" name="radioButton2" onClick="$('imgTyp').value=2018;$('seltime').fireEvent('onchange');" value="radiobutton"></td><td><label href="#" onClick="$('radioButton13').click();return false;" class="lbl2">可见光云图</label></td></tr></table></td>
  <tr><td>&nbsp;</td><td><table width="100%" border="0" cellspacing="0" cellpadding="1"><tr><td width="18"><input id="radioButton14" type="radio" name="radioButton2" onClick="$('imgTyp').value=8787;$('seltime').fireEvent('onchange');" value="radiobutton"></td><td><label href="#" onClick="$('radioButton14').click();return false;" class="lbl2">水汽云图</label></td></tr></table></td>
                      </tr>                           
                      </table><input type="hidden" name="imgTyp" value="2019"/></td>
                    </tr>
                     <tr id="showHistoryYear" style="display:none">
                   <td align="left">&nbsp;&nbsp;&nbsp;年月选择:<select name=selYear style="width:52" id=selYear><!-- onChange=showYearPic() -->
<c:forEach var="year" items="${requestScope.yearList}" >
<option value="${year}" <c:if test="${year eq curYear}">selected</c:if> >${year}</option>
        </c:forEach>
      </select>
       <select name=selMonth style="width:38" id=selMonth><!-- onChange=showYearPic() -->
<c:forEach var="month" items="${requestScope.monthList}" >
<option value="${month}" <c:if test="${month eq curMonth}">selected</c:if> >${month}</option>
        </c:forEach>
      </select>
      </td>
      </tr>
     
     
       <tr id="showHistoryTypes" style="display:none">
                   <td align="left">&nbsp;&nbsp;&nbsp;类别选择:<select name=selTypes style="width:94" id=selTypes><!-- onChange=showYearPic() -->
      <option value="">全部</option>
  <option value="6266">暴雨</option>
                          <option value="6267">台风</option>
      </select>
      </td>
      </tr>
     
   <tr id="showHistoryYearInfor" style="display:none">
   <td align="left">&nbsp;&nbsp;&nbsp;天气过程:<select name=selYearPic style="width:94" id=selYearPic>
  
   </select>
</td>
</tr>
                <!-- 右直线 -->  </table></td>
                <td width="1" bgcolor="B8B8B8"><img src="/images/spacer.gif" width="1" height="1"></td>
              </tr>
            </table></td>
        </tr>
<!-- 下弧 -->
        <tr>
          <td height="8"> <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_bottom_left.gif" width="7" height="8"></td>
                <td background="${pageContext.request.contextPath}/images/table_bottom_bg.gif"><img src="/images/spacer.gif" width="1" height="1"></td>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_bottom_right.gif" width="7" height="8"></td>
              </tr>
            </table></td>
        </tr>
      </table>
      <table width="98%" border="0" cellpadding="0" cellspacing="0" class="table-space">
        <tr>
          <td height="7"> <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_top_left.gif" width="7" height="7"></td>
                <td background="${pageContext.request.contextPath}/images/table_top_bg.gif"><img src="/images/spacer.gif" width="1" height="1"></td>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_top_right.gif" width="7" height="7"></td>
              </tr>
            </table></td>
        </tr>
        <tr>
          <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="1" bgcolor="B8B8B8"><img src="${pageContext.request.contextPath}/images/spacer.gif" width="1" height="1"></td>
                <td class="table-bg"><table width="100%" border="0" cellspacing="0" cellpadding="2">
                    <tr>
                      <td class="ititle">播放控制</td>
                    </tr>
                      <tr>
                      <td align="left">&nbsp;&nbsp;
  选择卫星云图:</td>
                    </tr>
                    <tr>
                      <td align="center">
                      <select name="drpPicture" id="drpPicture" size="8" multiple class="width" onChange="changePicture();">                         
  <c:forEach var="snph" items="${requestScope.snphList}" >
         <option value="${snph.imagePath}"><fmt:formatDate value="${snph.dateTime}" pattern="yyyy-MM-dd HH时mm分"/></option> 
      </c:forEach>      
                      </select>
                      </td>
                    </tr>
                    <tr>
                      <td align="center"> <input name="Submit" type="submit" class="buttons" value="第一张" onClick="first()">
                        <input name="Submit2" type="submit" class="buttons" value="末一张" onClick="last();">
                      </td>
                    </tr>
                    <tr>
                      <td align="center"> <input name="Submit4" type="submit" class="buttons" value="上一张" onClick="previous();">
                        <input name="Submit22" type="submit" class="buttons" value="下一张" onClick="next();">
                      </td>
  <tr>
                      <td align="center"> <input name="Submit3" type="submit" class="buttons" value="动画显示" onclick="autoPlay(this);">
                        <input name="Submit32" type="submit" class="buttons" value="全 屏" onclick="showall($('imgTyp').value, getPictList());">
                      </td>
                    </tr>
                    <tr>
                      <td align="left">&nbsp;&nbsp;
  播放速度:
                        <select name="showspeed" style="width:86" class=select onChange="changespeed()" id="showspeed">
                          <option value="200">非常快</option>
                          <option value="500">快</option>
                          <option value="1000" selected>正常</option>
                          <option value="1500">慢</option>
                          <option value="2500">非常慢</option>
                        </select></td>
                    </tr>
                  </table></td>
                <td width="1" bgcolor="B8B8B8"><img src="${pageContext.request.contextPath}/images/spacer.gif" width="1" height="1"></td>
              </tr>
            </table></td>
        </tr>
        <tr>
          <td height="8"> <table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_bottom_left.gif" width="7" height="8"></td>
                <td background="${pageContext.request.contextPath}/images/table_bottom_bg.gif"><img src="/images/spacer.gif" width="1" height="1"></td>
                <td width="7"><img src="${pageContext.request.contextPath}/images/table_bottom_right.gif" width="7" height="8"></td>
              </tr>
            </table></td>
        </tr>
      </table>
</td>
    <!--td width="9" align="right"><a href="#"><img src="images/mini2.gif" width="8" height="87" border="0"></a></td-->
  </tr>
</table>
<span id="progressMsg" style="display:none;"><img alt="Indicator" src="${pageContext.request.contextPath}/img/indicator.gif" /> Loading...</span> 
<div id="errorMsg" style="display:none;border:1px solid #e00;background-color:#fee;padding:2px;margin-top:8px;width:300px;font:normal 12px Arial;color:#900"></div>
<div>
  <img id="makerEmblem"
       src="${pageContext.request.contextPath}/img/placeholder.gif"
       width="76" height="29" />
</div>
<script type="text/javascript"> 
function initProgress() {
  Element.show('progressMsg');
  //autoPlay(document.all.Submit3);
  document.all.Submit3.value="动画显示";
  document.all.Submit3.title="动画显示";
  autoplaypicture=false;
  //$('selYearPic').value = document.all.selYearPic.value;
  //alert($('selYear').value + " ?= " + $('selYearPic').value);
  parent.showdiv();
}

function resetProgress() {
parent.closediv();
// show marker emblem
document.all.drpPicture[0].selected=true;
var imgTag = $('makerEmblem');
Effect.Fade('progressMsg');
if (document.all.showHistoryYear.style.display == '')
{
//$('selYearPic').fireEvent("onchange");
}

Page_Load();
}

function reportError() {   
  Element.show('errorMsg');
  setTimeout("Effect.DropOut('errorMsg')", 2500);
}

function selectedMe()
{

}

function loadseltimepic()
{
$('selYearPic').fireEvent("onchange");
}
</script>

<script type="text/javascript">
<c:choose>
<c:when test="${param.meeting != '1'}">
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=selectSnph", {
source: "seltime",
preFunction: initProgress,
target: "drpPicture",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},,selMonth={selMonth},selTypes={selTypes},selectpic={selectpic},mode=2",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});
/*
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=getYearBysatellite", {
source: "seltime",
preFunction: initProgress,
target: "selYear",
parameters: "seltime={seltime},imgTyp={imgTyp},mode=1",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});
*/
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=getWeatherProcess", {
source: "seltime",
preFunction: initProgress,
target: "selYearPic",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},mode=2",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});

new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=getWeatherProcess", {
source: "selYear",
preFunction: initProgress,
target: "selYearPic",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},mode=2",
parser: new ResponseXmlParser(),
postFunction: loadseltimepic,
errorFunction: reportError
});

/*
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=selectHistSnpc", {
source: "selYear",
preFunction: initProgress,
target: "drpPicture",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},selYearPic={selYearPic},mode=2",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});
*/

new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=getWeatherProcess", {
source: "selMonth",
preFunction: initProgress,
target: "selYearPic",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},mode=2",
parser: new ResponseXmlParser(),
postFunction: loadseltimepic,
errorFunction: reportError
});

/*
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=selectHistSnpc", {
source: "selMonth",
preFunction: initProgress,
target: "drpPicture",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},selYearPic={selYearPic},mode=2",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});
*/

new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=getWeatherProcess", {
source: "selTypes",
preFunction: initProgress,
target: "selYearPic",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},mode=2",
parser: new ResponseXmlParser(),
postFunction: loadseltimepic,
errorFunction: reportError
});
/*
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=selectHistSnpc", {
source: "selTypes",
preFunction: initProgress,
target: "drpPicture",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},selYearPic={selYearPic},mode=2",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});
*/
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=selectHistSnpc", {
source: "selYearPic",
preFunction: initProgress,
target: "drpPicture",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear={selYear},selMonth={selMonth},selTypes={selTypes},selYearPic={selYearPic},mode=3",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});
</c:when>
<c:otherwise>
$('seltime').fireEvent("onchange");
new AjaxJspTag.Select(
"${pageContext.request.contextPath}/qxxx/qxxxCasadeMenuAjaxAction.do?action=selectSnph", {
source: "seltime",
preFunction: initProgress,
target: "drpPicture",
parameters: "seltime={seltime},imgTyp={imgTyp},selYear=${param.outeryear},selMonth=${param.outermonth},selTypes=${param.outerctyp},selectpic={selectpic},selYearPic=${param.outercno},mode=2",
parser: new ResponseXmlParser(),
postFunction: resetProgress,
errorFunction: reportError
});
</c:otherwise>
</c:choose>
$('imgTyp').value=2019;
</script>
</body>
</html>

你可能感兴趣的:(apache,jsp,cache,struts,sun)