注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

IOS & JAVA KEY

(iMilo)

 
 
 

日志

 
 
关于我

All the splendor in the world is not worth a good friend!! Hello my friend!!

网易考拉推荐

通过SELECT下拉列表动态显示DIV  

2010-03-31 23:37:30|  分类: JavaScript |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

Select +div + js + strus2实现

①   假设一个DAO层调用数据库,在此用硬编码实现

package com.teana.dao;

import java.util.HashMap;
import java.util.Map;
/**
 * @author TEANA -- 2010-3-31
 * DAO实现
 * 窗口 > 首选项 > Java > 代码生成 > 代码和注释
 */
public class TgParaDAO
{
 private static TgParaDAO instance;
 private TgParaDAO()
 {
  
 }
 
 public static TgParaDAO getInstance()
 {
  if(null == instance)
   instance = new TgParaDAO();
  return instance;
 }
 
 @SuppressWarnings("unchecked")
 public Map[] getData()
 {
  Map[] datas = new HashMap[4];
  datas[0] = new HashMap();
  datas[0].put("tgID", "CTR001");
  datas[0].put("tgName", "A卡");
  datas[0].put("tgValue", "100.01");
  datas[0].put("desc", "描述A卡");
  
  datas[1] = new HashMap();
  datas[1].put("tgID", "CTR002");
  datas[1].put("tgName", "B卡");
  datas[1].put("tgValue", "100.01");
  datas[1].put("desc", "描述B卡");
  
  datas[2] = new HashMap();
  datas[2].put("tgID", "CTR003");
  datas[2].put("tgName", "C卡");
  datas[2].put("tgValue", "100.01");
  datas[2].put("desc", "描述C卡");
  
  datas[3] = new HashMap();
  datas[3].put("tgID", "CTR004");
  datas[3].put("tgName", "D卡");
  datas[3].put("tgValue", "100.01");
  datas[3].put("desc", "描述C卡");
  return datas;
 }
 
}

②    编写Action实现

package com.teana.action;

import java.util.Map;

import com.opensymphony.xwork2.ActionContext;
import com.opensymphony.xwork2.ActionSupport;
import com.teana.dao.TgParaDAO;

public class TgParaAction extends ActionSupport
{
  @Override
  public String execute() throws Exception
  {
   Map[] datas = TgParaDAO.getInstance().getData();
   Map request = (Map) ActionContext.getContext().get("request");
   request.put("datas", datas);
   return SUCCESS;
  }
}


③ 配置Struts.xml文件

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC
 "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
 "http://struts.apache.org/dtds/struts-2.0.dtd" >
<struts>
 <!-- 设置action的后缀 -->
 <!--
 <constant name="struts.action.extension" value="do" />
  -->
  <action name="para" class="com.teana.action.TgParaAction">
   <result name="success">/jsp/data/show.jsp</result>
  </action>
 </package>
</struts> 

④   配置web.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5"
 xmlns="http://java.sun.com/xml/ns/javaee"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
 http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
 
 <welcome-file-list>
   <welcome-file>index.jsp</welcome-file>
 </welcome-file-list>
 
 <filter>
  <filter-name>struts2</filter-name>
  <filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
  <init-param>
   <param-name>config</param-name>
   <param-value>struts-default.xml,struts-plugin.xml,../config/struts.xml</param-value>
  </init-param>
 </filter>
 <filter-mapping>
  <filter-name>struts2</filter-name>
  <url-pattern>/*</url-pattern>
 </filter-mapping>
 
 </web-app>

⑤:show.jsp页面

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%
  Map[] datas = (HashMap[])request.getAttribute("datas");
%>
<html>
  <head>
    <title>show.jsp</title>
    <SCRIPT type="text/javascript">
    function change(a)
    {                                                                        
  var xxx = document.getElementById("show");                                                             
  var divArray = xxx.getElementsByTagName("div");                                                         
  for (var i=0;i<divArray.length;i++)
  {                                                                   
    if (divArray[i].id == "div_" + a)
    {                                                                             
       divArray[i].style.display='';                                                                         
    }
    else
    {                                                                                                
       divArray[i].style.display='none';                                                                     
     }                                                                                                      
   }                                                                                                       
 }           
    </SCRIPT>
  </head>
 
  <body>
    <center>
     <table>
      <tr>
       <td><br><br>请选择:</td>
       <td><select name="tgID" onChange="change(this.value)">
       <%
        for(int i = 0; i < datas.length; i ++)
        {
        %>
        <option value="<%=datas[i].get("tgID") %>"><%=datas[i].get("tgName") %></option>
       <%
        }
       %>
       </select></td>
      </tr>
     </table>
     <br />
     <hr />
     <div id="show">
     <%
      for(int i = 0; i < datas.length; i ++)
      {
       String id = (String)datas[i].get("tgID");
       String style = "none";
       if( id.equals((String)datas[0].get("tgID")))
        style = "";
      %>
       <div id="div_<%=datas[i].get("tgID") %>" style="display:<%=style %>">
       <form action="#">
       <table border="1">
        <tr>
         <td>编号:</td>
         <td><%=datas[i].get("tgID") %></td>
        </tr>
        
        <tr>
         <td>名称:</td>
         <td><%=datas[i].get("tgName") %></td>
        </tr>
        
        <tr>
         <td>数值:</td>
         <td><input type="text" name="tgValue" value="<%=datas[i].get("tgValue") %>"/></td>
        </tr>
        
        <tr>
         <td>描述:</td>
         <td><input type="text" name="desc" value="<%=datas[i].get("desc") %>"/></td>
        </tr>
        <tr><td colspan="2">&nbsp;</td></tr>
        <tr>
         <td><INPUT TYPE="submit" value="提交"/></td>
         <td><input type="reset" value="重置" /></td>
        </tr>
       </table>
       </form>
       </div>
      <%
       }
       %>
      </div>
    </center>
  </body>
</html>

  

  评论这张
 
阅读(1008)| 评论(0)
推荐 转载

历史上的今天

在LOFTER的更多文章

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017