为什么80%的码农都做不了架构师？>>>

JSP + AjaxAnywhere页面开发

1. 开发工具

AJAX框架：AjaxAnywhere，最新版本1.1.0.6 , http://ajaxanywhere.sourceforge.net/

2. 开发规范

2.1 概述

“JSP + AjaxAnywhere” 的结合开发，是为了在普通JSP应用中增加AJAX特性，从而改善用户体验，提高应用性能。

AjaxAnywhere能于JSP很好结合。对于一个普通JSP 应用，要使用 AjaxAnywhere框架在一些特定功能中增加AJAX特性，只需对JSP页面做简单修改，基本不需要进行Javascript 编程，个别场合只需要按规范添加少量Javascript 代码。

AjaxAnywhere + JSP 的结合与 AjaxAnywhere +JSF 的结合，在原理上是一致的, 但在使用上略有不同。对于二者的不同，可对照《JSF+Ajax页面开发规范》，根据具体情形的不同，可以选择不同的组合进行开发。这里的JSP指的是不包括JSF内容的简单JSP页面。

2.2 规范

对于一个普通JSP页面，需要做以下修改。

2.2.1引入ajaxanywhere的taglib

<%@ taglib uri="http://ajaxanywhere.sourceforge.net/" prefix="aa" %>

依照习惯 prefix定义为aa.。

2.2.2 引入ajaxanywhere客户端脚本（Javascript）

说明：aa.js 是AjaxAnywhere框架的客户端脚本库，对AJAX 特性进行了很好的封装。开发人员无须直接操作XmlHttpRequest 。

AjaxAnywhere客户端的核心类为 AjaxAnywhere ，其每一个实例代表一个AJAX处理器。aa.js中定义了一个缺省的AjaxAnywhere实例, 实例名为ajaxAnywhere， id为default。

2.2.3 form 属性的修改

如果要对form提交增加AJAX支持，需要注意。在form标签中，必须包含action属性，但可以为空，name属性，method属性为post，然后按正常方式书写表单项目。

例如：

2.2.4定义ajax zone（动态更新区域）

需要单独刷新的部分在jsp页面中使用tag:

<aa:zone name="<zoneName>"> </aa:zone>

括住需要更新的范围。

例如：

<aa:zone name="zone1">

<font color="white"> <br>Test refresh zone<br>

<%=new Date()%><br>

</font>

</aa:zone>

<aa:zone/> 标记是用于在JSP页面中增加AJAX特性支持，要对JSF组件增加AJAX 特性支持，需要使用 <aa:zoneJSF/> 标记。

name是zone Tag的必填属性，用于在一个JSP页面内唯一标识一个动态更新的区域。一个页面可定义多个zone区域。

该标识的命名请遵循java变量命名规则。

2.2.5 修改表单的提交行为

表单的提交部分有两种，根据后台需要可以不同对待。

1）通过get 方式发出的请求采用AjaxAnywhere.getAJAX（）方法

例如：<input type="button" value="click me" οnclick="ajaxAnywhere.getAJAX();">

2) 通过post方式发出的请求请采用 ajaxAnywhere.submitAJAX() 方法

例如：<input type="button" value="click me" οnclick="ajaxAnywhere.submitAJAX();">

表单中的“提交”按钮，type需定义为 button， ajaxAnywhere.getAJAX（）和ajaxAnywhere.submitAJAX() 会自动处理表单数据的提交。作为与server交互的所需识别的信息头，路径（action）,数据由ajaxanywhere自行包装。

作为server端反馈部分，反馈的数据为xml类型，AjaxAnywhere客户端处理器最终将替换<aa:zone name="<zoneName>"></aa:zone> 中的全部内容，开发人员不需要进行其他编码处理。

另外一种方式是, 从外部给按钮增加 Ajax异步提交的效果:

//ajaxAnywhere.formName="myform"; 如果页面只有一个Form此行可以不要

ajaxAnywhere.substituteFormSubmitFunction();

</SCRIPT>

例如, 为表单中所有 submit 和image类型按钮增加Ａjax 特性:

例如, 为表单中特定按钮增加Ａjax 特性

ajaxAnywhere.formName="myform"; //如果页面只有一个Form此行可以不要

ajaxAnywhere.substituteFormSubmitFunction();

var ajaxButtons = new Array();

ajaxButtons[0] = document.getElementById("btn_new");

ajaxButtons[1] = document.getElementById("btn_run");

ajaxAnywhere.substituteSubmitButtonsBehavior(true, ajaxButtons);

2.2.6 服务器端代码:

2.2.6.1 指定Ajax 刷新区域

要刷新<aa:zone/> 区域, 必须在服务器端代码中指定要刷新的区域. 一般有两种方式: 在JSP中指定, 和在 Java代码中指定:

在JSP中指定, 例如:

if(AAUtils.isAjaxRequest(request)) AAUtils.addZonesToRefresh(request,"zoneResList");

一般放在JSP的顶部.

在 Java代码中指定, 通常是Web框架的控制器(Controller)代码中, Struts中是XXXAction类的方法中, JSF 中是 XXXFace 类的方法中. 例如:

protected ActionForward doCreate(ActionMapping actionMapping,

ActionForm actionForm, HttpServletRequest request,

HttpServletResponse response, User user) throws Exception {

………..

request.setAttribute(WebConstant.PAGE_ATTRIBUTE_MESSAGE, "保存成功！");

request.setAttribute(CMSConstant.BUTTON_SAVE_DISABLED, "TRUE"); // 屏蔽保存按钮

/* 刷新按钮区域 */

if (AAUtils.isAjaxRequest(request)) {

AAUtils.addZonesToRefresh(request, "zoneButton");

}

return (actionMapping.findForward("new"));

2.2.6.2

转载于:https://my.oschina.net/joeyjava/blog/28262