SEAM IN ACTION 第12章

12、Ajax and JavaScript remoting

This chapter covers

■ Combining Ajax and JSF

■ Validating form inputs instantly

■ Invoking components from JavaScript

■ Using Seam as a GWT service

本章讲述

结合Ajax 和JSF

立即校验表单录入

从JavaScript触发部件

使用GWT作为GWT服务

When applications are ported to the web environment, something is often lost in

translation: the user experience. Even nontechnical users understand the need to

wait for a page to load after each action, evidence of the lack of continuity that

plagues many web applications. Ajax provides a way to bring the rich, interactive

application (RIA) user experience to the web.

当应用处于WEB环境,一些东西经常会在翻译时丢失:用户经验。甚至非技术人员都知道在执行每个动作后要有个加载页面的等待。这证明在很多WEB应用中缺乏连续性。Ajax提供了一种方式,可得到丰富、交互应用(RIA)的用户体验。

In the previous chapter, you learned how the mission-critical and sometimes

daunting task of securing your application is dramatically simplified thanks to Seam.

By filling in a few blanks, you’re able to blanket your application with basic security

and then fine-tune it with contextual security rules. In this chapter, you’ll witness

another example of how Seam helps you transform your application with a handful

of keystrokes by leveraging its multifaceted Ajax support. This news is especially

promising, since moving to Ajax has proven to be a more costly investment than many

product managers first anticipated. One reason is that cross-browser JavaScript is not

for the faint of heart, and its problems can put the brakes on your development schedule.

Another is that JavaScript code quickly becomes spaghetti, making it difficult to

comprehend and even harder to test.

在前一章,你学习了SEAM是多么任务导向,一些吓人的安全任务在如何大幅地被SEAM减化。通过少量地填空,你可以让你的应用具有基本的安全,然后通过上下文安全规则来进行微调。这一章,你会见到另一个例子,看看SEAM如何帮助你转换你的应用,只稍作改变,就可以使用多面的Ajax支持。这是带来希望的新闻,因为转向Ajax被证明是一个成本比任何产品经理预测都高的投资。一个理由是跨浏览器JavaScript不适合脆弱的心脏,并用它的问题可能会迫使你的开发计划停下来。另一个是JavaScript代码快速快速成了意大利面,不易理解且难于测试。

In this chapter, you’ll discover that Ajax-based JSF component libraries and Seam’s

JavaScript remoting API offer a refreshed approach to Ajax by putting separation

between the application and the low-level XMLHttpRequest object, significantly reducing

the risk of letting Ajax through the door. The Ajax-enabled JSF component libraries

covered in this chapter, Ajax4jsf and ICEfaces, execute the JSF life cycle

asynchronously in response to user interactions, resulting in partial page updates that

don’t disrupt the user’s activity. Even better, this exchange is transparent to the developer,

who doesn’t have to touch a line of JavaScript. Rather than wait for the user’s

next move, ICEfaces has a mechanism for pushing presentation changes to the

browser in response to changes in the application state. JavaScript remoting cracks

the door open to JavaScript slightly, while still managing to hide the interaction with

the server, by allowing server-side components to be executed through JavaScript

function calls. Seam’s remoting can also give alternate front ends like GWT access to

the Seam component model.

这一章,你会发现基于Ajax的JSF部件库,及Seam的JavaScript remoting API提供了一个新的方式来实现Ajax,其将应用和底层XMLHttpRequest对象分离,明显地减少了Ajax带来的风险。启用Ajax的JSF部件库会在这一章讲到,Ajax4jsf 和ICEfaces,在与用户的交互中,异步地执行JSF生命周期,只部分地更新页面内容,从而不影响用户的行为。更好的是,这种交换对开发者是透明的,不用动一行JavaScript。不是让用户等待下一步,当应用的状态发生变化时,ICEfaces有一种机制可将变化送达浏览器。JavaScript remoting则让JavaScript来得更猛烈些,通过让服务器端部件使用JavaScript函数调用的方式,希望隐藏服务器上的交互。Seam’s remoting也可以提供另一上类似GWT的前端来访问Seam部件模型。

Although simplicity remains the underlying theme in the final part of this book,

the key word in this chapter is transparency. The investment you have made in learning

about the JSF life cycle, Seam components, and the EL throughout this book pays

off and helps you get your application rich quick. We begin by looking at how Ajax

is transparently weaved into the JSF component model and the types of interactions

this enables.

虽然在本书的最后部分力求简化,但本章更力求透明。本章,你在JSF life cycle, Seam components, 及 EL上的投入会得到回报,并使你的应用快速丰富。我们先看看Ajax如何被透明的织入JSF部件模型,还有可用的交互类型。

12.1 Using Ajax with JSF

JSF beat Ajax mania to the scene by nearly a year. The order of events was unfortunate

because Ajax would have fit perfectly with the design of JSF as an event-driven framework

backed by a server-centric model. Although Ajax wasn’t included in the JSF specification

(and still isn’t as of JSF 1.2), innovators recognized the potential of Ajax to close the gap

in the JSF vision and adapted it to JSF in an intelligent and efficient manner. This section

talks about the right and wrong ways of using Ajax with JSF, the two main component

libraries that brought Ajax to JSF, and Seam’s role in Ajax-based JSF requests.

在JSF中使用Ajax

JSF涉足Ajax已近一年。事件的顺序是一种不幸。作为事件驱动的框架,JSF是由服务器为中心的模型支持的,Ajax应与此做到匹配。虽然Ajax不被包含在JSF规范中(JSF 1.2中也不没有),革新者认识到Ajax的潜力可以填充JSF版本间的断层,使JSF可以更智能、更高效地使用。本节讨论在JSF中使用Ajax的对与错的地方,两个主要的部件库就将Ajax引入了JSF,在基于Ajax的JSF请求中Seam的作用。

12.1.1 Embracing a server-centric application model

JSF uses a server-side model to handle client-side events. The server then responds

with an updated view. Unfortunately, the standard mechanism in JSF for propagating

an event from the UI to the server is to use a regular form submit followed by a fullpage

refresh. This makes for a disruptive and costly event notification, in stark contrast

with the goal of Ajax and the rich web.

拥抱服务器为中心的模型

JSF使用了一种服务器端模型来处理客户端事件,随后服务器回应一个更新的了view。不幸的是,JSF的标准的将事件从UI传到服务器的机制是使用常规的表单提更新的交完整页面。这产生了分裂的高成本的事件通告,这与Ajax的目标和富WEB的目标形成了鲜明的对比。

JSF developers with Ajax-envy (myself being one of them) initially attempted to use

Ajax in their JSF applications by stepping outside the JSF component model. User

interactions would be trapped by custom JavaScript and the HTML in the rendered

page manipulated without JSF’s knowledge. To invoke the JSF life cycle from an Ajax

request, form data had to be fabricated to trick JSF into thinking the user had initiated

the event. When the response arrived, the rendered HTML would once again be

manipulated without JSF’s knowledge.

JSF开发者中的Ajax痴(我就是其中一员)开始试图通过超越JSF部件模型来在他们的JSF应用中使用Ajax。如果没有JSF知识,用户的交互会被生成的页面自定义的JavaScript和HTML搞晕。为了从Ajax请求激活JSF生命周期,表单数据必须组装来让JSF认为用户引发了事件。当回馈到达时,生成的HTML会再一次在没有JSF的情况下被操纵。

The trouble you get into when attempting to use ad hoc Ajax in JSF is that the rendered

page gets out of sync with the server-side UI component model. The next

authentic JSF postback is utterly confused, often resulting in unexpected behavior.

Frustrated developers pointed the finger at JSF for being too rigid. The real problem,

though, is the developer not appreciating JSF’s server-centric application model and

the benefits it provides.

当试图使用ad hoc Ajax于JSF中时,你陷入的困境是生成的页面会不再与服务器端部件模型同步。下一个可靠的JSF postback则完全认人困惑,经常会导致不可预期的行为。受伤的开发者指责JSF太死板。真实的问题是开发者没有领悟JSF的服务器中心的应用模型的精华。

The intent of JSF is to let you develop enterprise applications primarily in Java, with

a reasonable amount of declarative markup for connecting Java components to user

interface components (a linkage known as binding). Ajax, on the other hand, tempts

you to become involved in the low-level concerns of hand-coded Dynamic HTML

(DHTML) and JavaScript.

JSF的主旨是让你主要用JAVA来开发企业应用,使用合理数量的声明式修饰来连接JAVA部件到用户的界面部件(这种连接叫绑定)。Ajax却会让你处于手动编写动态HTML(DHTML) 和JavaScript的底层。

Programming models aside, JSF was designed to manage the UI. When it gets left

out of the loop, an impedance mismatch develops. The proper way to use Ajax with

JSF is to put JSF in charge of the Ajax communication, thus embracing JSF’s servercentric

model. This approach extends the value proposition of JSF to cover the development

of rich Java-based applications without needing to introduce the complexity of

JavaScript to the process. Both Ajax4jsf and ICEfaces position Ajax so that it honors

the JSF model.

除了编程模型,JSF用来管理UI。当离开回路,会出现开发的阻抗不匹配。使用带JSF的Ajax正确的方式是让JSF来管理Ajax通讯,以利用JSF的服务器中心模型。这一方式扩展了JSF的值命题来包含富基于JAVA的应用的开发而不需要见到JavaScript的复杂的处理。Ajax4jsf 和ICEfaces都是面向Ajax的JSF模型。

12.1.2 Ajax4jsf and ICEfaces open a communication channel to JSF

The main draw of Ajax is that it allows communication between the browser and the

server to proceed in the background without disrupting the user. In a JSF application,

it’s just as important to keep an open channel of communication between the rendered

page and the server-side UI component tree. That’s because, as soon as an Ajax

request is issued, the rendered page is at risk of becoming stale. It must be synchronized

with the server-side UI component tree as soon as possible to prevent its integrity

from being compromised.

Ajax4jsf 和ICEfaces打开了到JSF的通道

Ajax的主要好处是服务器与浏览器间的通讯在后台进行,不会打扰用户。在JSF应用中,在生成的页面和服务器端UI部件树间保持通讯通道很重要。这是因为,一旦Ajax请求发布,生成的页面就处于过期的风险中。它也必须尽可能与服务器端的UI部件同步以防止一致性受到破坏。

Although the outlook for the JSF and Ajax marriage may seem grim from this

description, Ajax4jsf and ICEfaces each provide a lightweight Ajax bridge that keeps

the lines of communication open. Even better, it’s mostly transparent to the developer.

Although the first ICEfaces release (August 2005) came six months earlier than

Ajax4jsf (March 2006), I want to start by discussing Ajax4jsf because it enables you

introduce Ajax into JSF incrementally.

虽然JSF 与Ajax的结合的前景暗淡,Ajax4jsf 和ICEfaces都提供了轻量级的Ajax桥梁,可使通讯畅通。更进一步,其对开发者几乎透明。虽然第一个ICEfaces(August 2005)版本发布比Ajax4jsf(March 2006)早六个月,我要先从Ajax4jsf开讲,因为它能展示逐步将Ajax引入JSF。

AJAX-ENABLING JSF WITH SUPPORT FROM AJAX4JSF

The challenge of introducing Ajax into JSF is that the standard UI components, and

plenty of third-party UI components, have no awareness of Ajax. Rather than mandating

that you switch to an Ajax-based UI component set, RichFaces developer Alexander

Smirnov developed a way to weave Ajax into JSF transparently, a solution now

known as Ajax4jsf. The mechanism he invented is so transparent, in fact, that it can be

used to “Ajax-enable” any JSF page without the UI components having any awareness

they’re participating in an Ajax request. This one library took JSF from being Ajaxinept

to being one of the most compelling approaches to Ajax.

While the Ajax4jsf component library contains a broad set of UI component tags, the

tag that gets the heaviest use, almost disproportionately so, is (often written

as ). It’s used to bind a user-initiated JavaScript event to a serverside

action invoked via Ajax and to designate regions of the page that get rerendered

from the Ajax response, encompassing the essence of Ajax4jsf.

AJAX4JSF所支持的AJAX

将AJAX引入JSF的难题是标准UI部件和很多第三方UI部件对Ajax没有意识。不是强迫你使用基于Ajax的UI部件,RichFaces的制作人Alexander Smirnov开发了一种方式透明的将Ajax织入JSF,现在另一个方案名为Ajax4jsf。其引入的机制很透明,可引入到任何Ajax的JSF页,而不用UI部件知道它们正在参与Ajax请求。这种只用一个库的方式使之成为最受瞩目的使用Ajax的方式。

================

Ajax4jsf or RichFaces—which is it?

RichFaces is a visual JSF component set that’s based on the Ajax4jsf concept and

APIs. Ajax4jsf was once its own project, but now it’s bundled with RichFaces. The

Ajax4jsf tags are geared specifically toward adding Ajax capabilities to non-Ajax components,

such as the standard JSF palette. RichFaces components natively support

the Ajax4jsf interaction. The rich in RichFaces credits both its support for Ajax and its

attractive look and feel.

RichFaces是一个可视化的基于Ajax4jsf概念和API的JSF部件集。Ajax4jsf原来是独立的项目,现在绑定到了RichFaces。Ajax4jsf标签被特别地加入以增加Ajax的兼容性到非Ajax部件,如标准JSF模板。RichFaces部件生来支持Ajax4jsf交互。RichFaces的富归功于其对Ajax的支持和诱人的外观和感觉。

================

A PATCHWORK OF UPDATES

The Ajax4jsf process is depicted in figure 12.1. When a request is sent out by Ajax4jsf,

the JSF life cycle is invoked, just like with a standard JSF request. However, since the

request occurs using Ajax, the page doesn’t change, at least not immediately. To

ensure that the rendered page doesn’t become stale, Ajax4jsf lets you declaratively

control which areas of the UI to synchronize. Prior to the rendered page being sent

back to the Ajax engine, Ajax4jsf extracts the corresponding markup and returns only

a set of “patches” (i.e., XHTML fragments) to the browser. The Ajax engine cuts out

the dead areas of the UI and stitches in the replacements. Since the state of these

areas remains consistent with the server-side UI component tree, any JSF-related

actions triggered in those areas behave as expected.

升级的大拼盘

Ajax4jsf的过程在图12.1中描述。当一个请求由Ajax4jsf发送,JSF生命周期被激活,就像标准JSF请求。不管怎样,因为请求使用Ajax,页面没有改变,至少没有立即改变。为了确保生成的页面没有过期,Ajax4jsf让你声明式控制哪个区域的UI被同步。在生成的页面被送回到Ajax引擎之前,Ajax4jsf提取了对应的标记,只返回一套“补丁”(如XHTML片段)到浏览器。Ajax引擎切出UI的死区,加进替代区。因为这些区域的状态与服务器UI部件树保持一致,任何在这些区域被触发的JSF相关的actions会像期望一样动作。

clip_image001.png

Let’s put this process into practice on the golf course search screen. Right now, when

the user clicks the Search button to filter the results, it causes a full-page refresh. It would

be faster and less disruptive to simply replace the results table, the area of the page we

want to rerender. First, we need to assign an id to the results panel, giving it a “handle”:

让我们将这一过程付诸实现于高尔夫球场的搜索页面。现在,当用户点击了搜索按钮来过滤结果,它会导致完整页面的刷新。如果只更新结果表,我们想生成的那个区域,会快些并且更少打扰用户。首先我们需要指定一个ID到结果页面,给其一个“控制点”:

Course search results

Next, we nest the tag within an input field in the search form, tying a

JavaScript event triggered by this field to an invocation of the JSF life cycle. To ensure

that the search runs as soon as possible but not before the user is done typing, we

choose to bind to the input field’s onblur event (i.e., when it loses focus). We also tell

Ajax4jsf which area of the page to rerender by declaring a component id in the

reRender attribute:

然后,我们在搜索页面嵌套标签于一个输入字段,连结一个被这一字段触发的JavaScript事件到一个JSF生命周期的调用。以确保搜索尽快执行,但不会在用户完成录入之前,我们选择绑定到录入字段的onblur事件(当其失去焦点时)。我们也告诉Ajax4jsf哪个区域要用在reRender属性中声明部件ID的方法来生成:

When the user tabs or clicks away from the input field, an Ajax request is sent, invoking

the JSF life cycle just as though the user had clicked the Search button. But in this

case, the response is filtered by Ajax4jsf and only the results panel is sent back. The

page is then updated incrementally to reveal the new search results.

当用户点离或tabs开录入域,会发送一个Ajax请求。激活JSF生命周期,就像用户点击了搜索按钮。但在这种情况下,反馈会被Ajax4jsf过滤掉,只有结果集被送回。页面随后被增量更新来反映新的搜索结果。

The search is able to execute without an explicit action because the Query component

automatically detects when the search criteria has changed. You may have a

situation that requires an explicit action to be called in order for the search to

execute. Ajax4jsf lets you specify either an action or an action listener on the

tag, using the action and actionListener attributes, respectively. This

turns the tag into a UI command component, which isn’t triggered by a

click but rather a JavaScript event:

没有明确的action时,搜索也能执行。因为当查询规范变化时,查询部件会自动检测。可能某时你要请求一个明确的action来执行搜索。Ajax4jsf让你使用action 或actionListener在上指定一个action或action监听器,这会调整标签到UI命令部件,这不是被点击而是一个JavaScript事件:

action="#{hypotheticalSearchAction.search}"/>

If we were to continue Ajax-enabling every input field in the search form, the only

problem would be having to specify the reRender attribute each time. Fortunately,

Ajax4jsf supports a way to make certain branches of the tree support “autografting.”

By wrapping the tag around a region of the

page, it tells Ajax4jsf to automatically rerender that region whenever an Ajax request

passes through the Ajax engine. Let’s apply this to the search results panel:

如果我们要继续在搜索表单的每个录入域启用Ajax,唯一的问题是不得不每次指定reRender属性。幸运地,Ajax4jsf支持一种方法让一些树的分支支持自体移植。通过包装标签于页面的一个区域,无论何时Ajax请求传递到Ajax引擎,它让Ajax4jsf自动重画区域。让我们应用这个到搜索结果页面:

Course search results

With the autografting output panel in place, the tags no longer have to

specify the reRender attribute. If you’re doing other Ajax operations on the page, you

can localize the Ajax activity that triggers automatic rerendering by wrapping a portion

of the page in . In this case, you might wrap the search form and

results panel.

当自体移植输出页面就位后,标签不必指定reRender属性。如果你在页面上做其它Ajax操作,你可以定位Ajax行为。其能过包装页面的一个部分。在这种情况下,你可以包装搜索表单和结果页面。

Although it may seem like a lot of work to merge the changes back into the UI, this

work is far outweighed by the benefits. It ensures the integrity of the page is maintained,

it makes Ajax transparent to the developer, and, since the response contains

only necessary updates and not a full HTML document, JSF can behave like an efficient

event-driven framework and the user’s activity isn’t disrupted by a page refresh.

虽然它看上去将变化合并到UI中是很多工作,这个工作对于得到的益处是很值的。它确保了页面的完整性,并使Ajax对于开发者透明,当回馈中只保留必要的更新,而不是完整HTML文档,JSF会像一个有效的事件驱动的框架,用户的操作不会被页面的刷新打扰。

Ajax4jsf lets you adopt Ajax without having to write JavaScript or replace your existing

components, but it still requires that you do a fair amount of work to configure

the Ajax interactions. Depending on what you’re trying to accomplish, this can be

either a good or a bad thing. One of the limitations of Ajax4jsf is that the marked

regions of the page are synchronized even if the markup hasn’t changed. Regions that

aren’t specified are prone to falling out of date. What you are basically missing is intelligent

synchronization of the UI, a central concern in ICEfaces.

Ajax4jsf让你适应Ajax而不用写JavaScript或替代你已存在的部件,但它还需要你做很多Ajax交互的配置工作。依你要完成的内容的不同,这可能是好事也可能是坏事。Ajax4jsf的一个限制是页面中被标出的区域被同步,虽然标记没有改变。同有指定的区域则可能会过期。你基本缺少的是智能的UI的同步,这是ICEfaces的中心概念。

INTELLIGENT UI SYNCHRONIZATION WITH ICEFACES

ICEfaces is an Ajax extension for JavaServer Faces that regards Ajax as a framework

concern rather than a developer concern. Ajax-based JSF applications using ICEfaces

are virtually indistinguishable from non-Ajax JSF applications. The key lies with the

ICEfaces rendering process. Rather than rendering to a stream that’s sent directly to

the browser, each view is rendered into a Document Object Model (DOM) on the

server, another progression of the UI component tree. The changes to the DOM are

detected after each invocation of the JSF life cycle and only the corresponding

markup is sent to the browser. As with Ajax4jsf, an Ajax bridge resident in the browser

is responsible for merging these updates into the page, as illustrated in figure 12.2.

使用ICEFACES来做智能的UI同步

ICEfaces是JavaServer Faces的一个Ajax扩展,其将Ajax用作一个框架概念而不是开发者概念。使用ICEfaces的

基于Ajax的JSF应用实现上与非Ajax的JSF应用是不好区分的。关键在于ICEfaces重画过程,而不是重画到一个到浏览器的流,每个view被重画到服务器的数据对象模型(DOM)--UI部件树的另一个改进。JSF生命周期的每次调用,到DOM的改变被检测。只有对应的标记被发送到浏览器。就像用Ajax4jsf,保留在浏览器中的Ajax桥负责合并这些更新到页,示例如图12.2

There are two key benefits to the ICEfaces approach (which is known as Direct-to-

DOM [D2D] rendering). First, it reflects an efficient use of the network, making it

especially suitable for mobile applications. Second, the developer doesn’t need to

decide which areas of the page need to be rerendered when an event is triggered—

that’s something the framework decides at runtime. In fact, the developer

doesn’t have to do anything to Ajax-enable the UI components on the page. Ajax is

baked in at a much deeper level so that every interaction is channeled through an

Ajax request.

ICEfaces方法有两个关键的好处(表示为Direct-to-DOM[D2D]重画)。首先,它反映一个高效的网络使用,使其特别适用于移动应用。第二,开发者不需要决定当事件被触发时,页面的哪个区域应被重画,这些事在运行时由framework决定。事实上,开发者对页面上的UI部件不用做任何事。Ajax处于深层,所以每个交互由一个Ajax请求传递。

clip_image002.png

TIP

If a long-running conversation isn’t active, the conversation id changes

during the Ajax request. Since Seam automatically appends the conversation

id to Seam UI command components, this confuses ICEfaces into

thinking that areas of the page have changed, resulting in a much

larger Ajax response than necessary. To remedy this problem, you

either need to ensure that the conversation id isn’t rendered somewhere

in the HTML markup or operate within the context of a longrunning

conversation.

如果一个长期运行的会话未激活,会话的ID会在Ajax请求中改变。既然SEAM自动地增加会话IDSEAMUI命令部件,这会误导ICEfaces认为页面的区域已修改,结果这个Ajax回馈会大于必要的。为了修补这个问题,你需要确保会话ID没有在HTML标记中或在一个上下文相关的长期会话中被重画。

Let’s look at the course search example again, this time augmenting it using ICEfaces.

Since it’s not necessary to declare which areas of the page are synchronized,

we’re only concerned with the search form. Here’s one of the input fields and the

submit button:

让我们再看看球场的搜索页面例子,这一次用ICEfaces作参数。因为不必声明页面中哪个区域是同步的,我们只关心搜索表单。这里是录入字段及提交按钮中的一个:

Hmm. That’s interesting—no special Ajax tags. As I mentioned, ICEfaces transparently

adds Ajax interactions to the page. It does so by replacing the standard JSF component

renderers with renderers cognizant of the D2D mechanism. In order for the

page to be updated in place, you simply forgo use of a JSF navigation event, guaranteed

in this case since an action isn’t specified in the UI command button. That raises

an important point. Although requests are made over Ajax, JSF navigation rules are

still honored. The same goes for Ajax4jsf.

有趣--没有特殊的Ajax标签。正如我提过的,ICEfaces透明地增加Ajax到页面。通过替代标准的JSF部件重画器为重画器相识的D2D机制来实现。为了页面在适当的位置更新,你简单地禁用JSF导航事件,确保在这种情况下,一个action没有被指定到UI命令按钮。这带来重要的一点,虽然请求是通过Ajax的,JSF导航规则仍有效,对于Ajax4jsf也是这样。

There is a key improvement that can be made in the ICEfaces example. Currently,

the Ajax request only happens when the Search button is activated, whereas in the

Ajax4jsf example, the search occurs when the input field loses focus. This behavior is

accomplished in ICEfaces using a feature known as partial submit. While it’s possible to

trigger a partial submit using a built-in JavaScript function, in the spirit of transparency

we use the ICEfaces input component tag to hide this JavaScript behind declarative

markup. This tag also brings the benefit of component styling.

有一个重要的改善可加入ICEfaces例子,现在,Ajax请求只发生在查询按钮处于激活时,而在Ajax4jsf例子中,查询发生在输入字段失去焦点时。这个行为在ICEfaces中使用一个名为部分提交的特性来完成。这也可能触发一个使用内建JavaScript函数的部分提交,为了透明,我们使用ICEfaces录入部件标签来隐藏这个JavaScript于声明标记之后。这个标签也带来部件风格的好处:

The partialSubmit attribute activates the same behavior as the

"onblur"> tag in Ajax4jsf. Partial submit is explored in more depth in section 12.2.

部分提交属性激活Ajax4jsf中一样的行为。在12.2节中,部分提交有更多描述。

Ajax4jsf and ICEfaces are about more than just Ajax. They are about letting you

perform incremental page updates synchronized from the state on the server. You no

longer have to design pages around the full-page refresh model. Instead, you can consider

fine-grained manipulation of the page to achieve rich effects in the application.

The patchwork of updates that are merged back into the rendered page behave as

though they’d been there all along (meaning when the page was initially rendered).

In addition to incremental page updates, RichFaces and ICEfaces offer styling of components,

rich widgets, drag and drop, visual effects, and many more features that set

your application apart from a classic web application.

Ajax4jsf和ICEfaces不仅仅是Ajax。它们是让你做渐近的页面更新来与服务器的状态同步。你不再在完整页面刷新模式下设计页面。而是考虑细粒度的页面操作以达到应用的丰富效果。跟踪的拼凑合并成了生成页的行为从一开始就有(意味着当页面被初始化生成)。除了递增的页面更新,RichFaces 和ICEfaces也提供部件风格、富物件、拖拽、视觉效果及其它很多特性,将你的应用与典型WEB应用区分开。

The big question at this point is, what’s Seam’s role in all of this Ajax stuff? That’s

the real beauty of it. Seam just keeps doing what it does best.

这一点最大的问题是在这些Ajax中,Seam的角色是什么?这是最本质的,SEAM只保留它做得最好的。

12.1.3 Seam’s role in Ajax-based JSF requests

While the Ajax requests allow the page to continuously interact with Seam, there’s nothing

that Seam has to do differently. The JSF life cycle is still invoked and therefore Seam

treats each request just as it would any other postback. That doesn’t mean Seam has

nothing to add, though. On the contrary, you find that Seam’s stateful design lends itself

perfectly to the Ajax-enabled JSF environment. Here are a few ways Seam adds value:

基于Ajax的JSF请求中,SEAM的作用

虽然Ajax请求允许页面持续与SEAM交互,SEAM却不必非做些特别的。JSF生命周期仍是激活,因此SEAM对待每个请求和对待其它postback一样。这不意味SEAM没什么东西可加。相反,你发现SEAM的有状态设计很适合基于Ajax的JSF环境。下面是SEAM的一些附加值。

■ Maintain server-side state —Seam can connect the state from one Ajax request to

the next, avoiding the negative impact of pounding the server’s resources. Both

the page scope and a long-running conversation work well here. Seam can even

facilitate an application transaction performed entirely over Ajax.

维护服务器端状态--SEAM可以从一个Ajax请求到另一个地连接状态,避免浪费服务器资源的负面影响。面范围和长期运行的会话可工作得很好。SEAM甚至可以促使一个应用事务完全使用Ajax。

■ Contribute outjected context variables —Any action invoked during an Ajax request

can trigger bijection. The outjected context variables are available to the regions

of the view being rerendered.

有肋于注出上下文变量--任何一个Ajax请求可以触发双注。注出的上下文变量在view被重画的范围内可用。

■ Dry-run the JSF life cycle —Ajax4jsf can ask JSF to run through the life cycle without

performing actions or navigations to verify that form data is acceptable.

Seam’s integration with Hibernate Validator is of most interest here.

JSF生命周期的Dry-run--Ajax4jsf可请求JSF去运行通过生命周期而不操作actions或导航去校验表单数据是否可接受。SEAM与Hibernate校验器的集成在这里是最有趣的。

■ Notify changes in application state —Seam’s event/observer model, its asynchronous

dispatcher, and its integration with JMS offer ways to notify components of

a change in the application’s state. When combined with ICEfaces’ Ajax Push,

presentation changes can be sent to browsers with having to wait for interaction

from the user.

通知应用状态的变化--SEAM的事件/观察者模型,是异步的分配器,集成了JMS,提供很多方式来通知部件应用状态的变化。当结合ICEfaces’ Ajax Push,显示的变化必须等待与用户的交互完成才发送到浏览器。

Aside from the last point, covered in detail in section 12.3, the items in this list remain

consistent with points made throughout the book. The only difference now is that

everything is happening in closer to real time and the browser isn’t spinning its wheels

reloading the page. You do need to be aware that Ajax requests occur more frequently,

so there’s a greater chance that multiple requests in the same conversation

will arrive at the server simultaneously. See the accompanying sidebar on the topic of

conversation contention.

除了最后一点,细节将在12.3中描述。列表中的条目与书中的保持一致。现在唯一的不同是每件事会与真实发生时间更接近,浏览器没有停下来重新加载页面。你确实需要了解Ajax的请求发生得更频繁,所以有很多时候会有多个同一会话的请求同时到达服务器。看看附加的关于会话争论的主题。

No configuration is necessary to use RichFaces/Ajax4jsf with Seam. As long as the

RichFaces JAR files are present on the classpath and the SeamFilter is registered in

来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/21802202/viewspace-1027643/,如需转载,请注明出处,否则将追究法律责任。

转载于:http://blog.itpub.net/21802202/viewspace-1027643/

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值