《struts2权威指南》学习笔记之struts2 ajax标签s和submit

来源:互联网 发布:网页视频抓取工具 mac 编辑:程序博客网 时间:2024/04/19 01:31

<s:a>这个标签生成一个超级链接,用于像服务器发送异步请求,并将服务器响应加载在指定HTML元素中

web.xml

 

<?xml version="1.0" encoding="GBK"?>
<web-app version="2.4" xmlns="http://java.sun.com/xml/ns/j2ee"
    xmlns:xsi
="http://www.w3.org/2001/XMLSchema-instance" 
    xsi:schemaLocation
="http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">

<servlet>

    
<servlet-name>dwr</servlet-name>
        
<servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class>
        
<init-param>
           
<param-name>debug</param-name>
           
<param-value>true</param-value>
        
</init-param>
    
</servlet>

    
<servlet-mapping>
        
<servlet-name>dwr</servlet-name>
        
<url-pattern>/dwr/*</url-pattern>
    
</servlet-mapping>



        
<filter>
        
<filter-name>struts2</filter-name>
        
<filter-class>org.apache.struts2.dispatcher.FilterDispatcher</filter-class>
    
</filter>

    
<filter-mapping>
        
<filter-name>struts2</filter-name>
        
<url-pattern>/*</url-pattern>
    
</filter-mapping>

</web-app>

 struts.xml

 

<!DOCTYPE struts PUBLIC
    "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN"
    "http://struts.apache.org/dtds/struts-2.0.dtd"
>

<struts>

    
<constant name="struts.custom.i18n.resources" value="messageResource"/>
    
<constant name="struts.i18n.encoding" value="GBK"/>

    
<package name="ajax" extends="struts-default">
        
<action name="AjaxTest" class="lee.AjaxTestAction">
            
<result>/AjaxResult.jsp</result>
        
</action>
        
<action name="Test3">
            
<result>/testjs.jsp</result>
        
</action>
    
</package>

</struts>

 

RandomAction

 

package lee;

import com.opensymphony.xwork2.Action;

import java.io.Serializable;


public class AjaxTestAction implements Action, Serializable
{

    
private static int counter = 0;
    
private String data;

    
public long getServerTime()
    
{
        
return System.currentTimeMillis();
    }


    
public int getCount()
    
{
        
return ++counter;
    }


    
public String getData()
    
{
        
return "服务器提示:" + data;
    }


    
public void setData(String data)
    
{
        
this.data = data;
    }


    
public String execute() throws Exception 
    
{
        
return SUCCESS;
    }

}

 

AjaxResult.jsp

 

<%@ page contentType="text/html;charset=GBK" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
    request.setAttribute(
"decorator""none");
    response.setHeader(
"Cache-Control","no-cache"); //HTTP 1.1
    response.setHeader(
"Pragma","no-cache"); //HTTP 1.0
    response.setDateHeader (
"Expires"0); //prevents caching at the proxy server
%>

服务器计数器: 
<s:property value="count"/><br>
当前时间是:
<s:property value="serverTime"/><br>
服务器返回的提示是:
<s:property value="data"/>

testjs.jsp

 

<%@ page contentType="text/html;charset=GBK" language="java" %>
<%
    request.setAttribute(
"decorator""none");
    response.setHeader(
"Cache-Control","no-cache"); //HTTP 1.1
    response.setHeader(
"Pragma","no-cache"); //HTTP 1.0
    response.setDateHeader (
"Expires"0); //prevents caching at the proxy server
%>

<script language="JavaScript" type="text/javascript">
    alert(
'Spring2.0宝典');
</script>
轻量级J2EE企业应用实战
<script language="JavaScript" type="text/javascript">
    alert(
'基于J2EE的Ajax宝典!');
</script>

 

remotelink.jsp

 

<%@ page contentType="text/html;charset=GBK" language="java" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
    
<title>远程链结</title>
    
<s:head theme="ajax"/>
</head>

<script type="text/javascript">
    
function before(){alert("before request");}
    
function after(){alert("after request");}
    
function handler(widget,node){
      alert(
"本地函数");
      dojo.byId(widget.targetsArray[
0]).innerHTML="spring2.0宝典";
    }

    dojo.event.topic.subscribe(
"/after",function(data,type,e){
      alert(
"正处于dojo的异步交互过程中,类型是:"+type);
    }
)
    
</script>

<body>
<s:url id="ajaxTest" value="/AjaxTest.action" />
<s:url id="test3" value="/Test3.action" />
<div id="t1" style="background-color:#bbbbbb;width:360px;height:80px">Div 1</div>
<br/>
<div id="t2" style="background-color:#bbbbbb;width:360px;height:80px">Div 2</div>
<br/>

<br/>
同时修改Div1和Div2的内容
<br/>
且将事件发布到/after主题(指定notifyTopics属性)
<br/>
<s:a    id="link1"   
        theme
="ajax"
        href
="%{ajaxTest}"
        indicator
="indicator"
        targets
="t1,t2" notifyTopics="/after" >修改Div1和Div2内容</s:a>
<img id="indicator" src="${pageContext.request.contextPath}/images/indicator.gif" alt="Loading..." style="display:none"/>

<br/>
指定服务期返回失败时的错误提示(指定errorText属性)
<br/>
因为系统中AjaxNoUrl.jsp页面不存在,肯定出错!
<br/>
<s:a    id="link2"
        theme
="ajax"
        href
="/AjaxNoUrl.jsp"
        errorText
="系统服务器返回信息出错"
        targets
="t1">修改'Div 1'内容,使用自定义出错提示</s:a>
<br/>
指定系统加载中的提示信息(指定loadingText属性)
<br/>
<s:a    id="link3"
        theme
="ajax"
        href
="%{ajaxTest}"
        loadingText
="系统正在加载中..."
        targets
="t1">修改'Div 1'内容,使用自定义加载信息</s:a>
<br/>

执行远程JavaScript代码(指定executeScripts=true属性)
<br/>
<s:a    id="link4"
        theme
="ajax"
        href
="%{test3}"
        executeScripts
="true"
        targets
="t2">接执行远程JavaScript</s:a>
<br/>

通过使用自定义JavaScript函数来实现Ajax交互(指定handle属性)
<br/>
<s:a    id="link5"
        theme
="ajax"
        href
="%{ajaxTest}"
        handler
="handler"
        targets
="t2">使用自定义的处理函数</s:a>
<form id="form">
  
<input type=textbox name="data">
</form>
提交表单请求(通过指定formId属性)
<s:a    id="link6"
        theme
="ajax"
        href
="%{ajaxTest}"
        targets
="t2"
        formId
="form">Div 2 会显示在上面文本框中输入的内容</s:a>
</body>
</html>

 

remotebutton.jsp

 

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
<head>
    
<title>远程按钮</title>
    
<s:head theme="ajax" debug="true"/>
</head>

<script type="text/javascript">
    dojo.event.topic.subscribe(
"/after"function(data, type, e){
      alert(
'正处于Dojo的异步交互过程中,类型是:'+type);
      
//data : text returned
      //type : "before", "load" or "error"
      //e    : request object
   }
);
</script>

<body>

<div id="t1" style="background-color:#bbbbbb;width:360px;height:80px">将被改变的结果</div>
<s:url id="ajaxTest" value="/AjaxTest.action" />
简单的提交按钮,使用indicator
<br>
<img id="indicator" src="${pageContext.request.contextPath}/images/indicator.gif" alt="Loading..." style="display:none"/>
<!-- targets属性设置用于装载被改变的HTML元素 -->
<s:submit type="submit" theme="ajax" value="提交" targets="t1" href="%{ajaxTest}" align="left" indicator="indicator"/>
<br/>
简单的提交按钮,使用pub-sub事件模型(设置notifyTopics=/after属性)
<br>
<s:submit type="submit" theme="ajax" value="提交" targets="t1" href="%{ajaxTest}" align="left" notifyTopics="/after"/>
<br/>
图片按钮(通过指定type="image")
<br>
<s:submit type="image" theme="ajax" label="Alt Text" targets="t1"
  src
="${pageContext.request.contextPath}/images/struts-power.gif" href="%{ajaxTest}" align="left" />
<br/>
异步方式提交表单:(在下面输入的文本将在上面显示)
<s:form id="form" action="AjaxTest">
  
<input type="text" name="data"/>
  
<s:submit type="button" theme="ajax" label="发送" targets="t1" id="ajaxbtn"/>
</s:form>

</body>
</html>

 

struts.properties

struts.custom.i18n.resources=messageResource
struts.i18n.encoding=utf-8
struts.locale = UTF-8

原创粉丝点击