8:15 p.m.
Author: SergeySmirnov
Date: 2007-07-20 21:15:48 -0400 (Fri, 20 Jul 2007)
New Revision: 1767
Added:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/commandButton/usage.xhtml
trunk/samples/richfaces-demo/src/main/webapp/richfaces/support/usage.xhtml
Log:
support and commandButton
Added: trunk/samples/richfaces-demo/src/main/webapp/richfaces/commandButton/usage.xhtml
===================================================================
--- trunk/samples/richfaces-demo/src/main/webapp/richfaces/commandButton/usage.xhtml
(rev 0)
+++
trunk/samples/richfaces-demo/src/main/webapp/richfaces/commandButton/usage.xhtml 2007-07-21
01:15:48 UTC (rev 1767)
@@ -0,0 +1,49 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml"
+ xmlns:ui="http://java.sun.com/jsf/facelets"
+ xmlns:h="http://java.sun.com/jsf/html"
+ xmlns:f="http://java.sun.com/jsf/core"
+ xmlns:a4j="http://richfaces.org/ajax"
+ xmlns:rich="http://richfaces.ajax4jsf.org/rich">
+ <ui:composition template="/templates/component-sample.xhtml">
+ <ui:define name="sample">
+
+ <p>
+ a4j:commandButton is similar to the standard h:commandButton, but produces an
+ Ajax request with further partial page update. 'reRender' attribute point to
the
+ component(s) that should be re-rendered in the component tree and updated
+ in the browser DOM after the ajax response is complete.
+ </p>
+
+ <p>
+ The following example shows how the greeting message is shown on the screen
+ without refreshing the entire page:
+ </p>
+
+ <div class="sample-container" >
+ <rich:separator width="1" />
+
+ <a4j:form>
+ <h:panelGrid columns="3">
+ <h:outputText value="Name:" />
+ <h:inputText value="#{userBean.name}" />
+ <h:commandButton value="Say Hello" reRender="out" />
+ </h:panelGrid>
+ </a4j:form>
+ <h:panelGroup id="out">
+ <h:outputText value="Hello " rendered="#{not empty
userBean.name}" />
+ <h:outputText value="#{userBean.name}" />
+ <h:outputText value="!" rendered="#{not empty
userBean.name}" />
+ </h:panelGroup>
+
+ <rich:separator width="1" style="padding-top:10px" />
+ </div>
+
+
+ </ui:define>
+ <ui:define name="sources">
+ Here is a fragment of page sources for the given example:
+ <iframe
src="${facesContext.externalContext.requestContextPath}/richfaces/commandButton/source/usage.html"
class="source_frame"/>
+ </ui:define>
+ </ui:composition>
+</html>
Property changes on:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/commandButton/usage.xhtml
___________________________________________________________________
Name: svn:mime-type
+ text/plain
Added: trunk/samples/richfaces-demo/src/main/webapp/richfaces/support/usage.xhtml
===================================================================
--- trunk/samples/richfaces-demo/src/main/webapp/richfaces/support/usage.xhtml
(rev 0)
+++ trunk/samples/richfaces-demo/src/main/webapp/richfaces/support/usage.xhtml 2007-07-21
01:15:48 UTC (rev 1767)
@@ -0,0 +1,68 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml"
+ xmlns:ui="http://java.sun.com/jsf/facelets"
+ xmlns:h="http://java.sun.com/jsf/html"
+ xmlns:f="http://java.sun.com/jsf/core"
+ xmlns:a4j="http://richfaces.org/ajax"
+ xmlns:rich="http://richfaces.ajax4jsf.org/rich">
+ <ui:composition template="/templates/component-sample.xhtml">
+ <ui:define name="sample">
+
+ <p>
+ a4j:support is a most important core component in the RichFaces library. It allows
+ to add an Ajax capability to the existing non-ajax components. All other Ajax
component
+ are based on the same principles a4j:support has.
+ </p>
+ <p> a4j:support should be attached a direct child of the JSF component that has
to be ajaxified.
+ The key attributes are 'event' and 'reRender'. 'event'
attribute defines the javascript
+ event the ajax support will be attached at. 'reRender' attribute points to
the JSF
+ component(s) that should be re-rendered on the server side and updated on the
+ client when ajax response come back.
+ </p>
+ <p>
+ The following example shows how the outputText component value is changed while user
is
+ typing in the input field:
+ </p>
+
+
+ <div class="sample-container" >
+ <rich:separator width="1"/>
+ <h:form>
+ <h:panelGrid columns="2">
+ <h:inputText value="#{userBean.name}">
+ <a4j:support event="onkeyup" reRender="outtext" />
+ </h:inputText>
+ <h:outputText id="outtext" value="#{userBean.name}" />
+ </h:panelGrid>
+ </h:form>
+ <rich:separator width="1" style="padding-top:10px"/>
+ </div>
+
+ <p>
+ a4j:support is wired with the event of the parent component during the Render
Response
+ phase on the server side. So, the number of possible events is limited to the ones
+ defined with particular component attributs. The wiring with events dynamically
attached
+ on the client side is not supported.
+ </p>
+
+ <p>
+ reRender attribute allows to use JSF EL expression as value. So, you can create
+ a list dynamically deciding what should be re-rendered as a result of ajax request.
+ </p>
+
+ <p>
+ In case of attaching a4j:support to non-Ajax JSF command component, such as
h:commandButton
+ or h:commandLink, it is important to set disableDefault equals true. Otherwise,
non-ajax
+ request will be send just after ajax request and the page will be unexpectedly
refreshed.
+ </p>
+
+
+
+
+ </ui:define>
+ <ui:define name="sources">
+ Here is a fragment of page sources for the given example:
+ <iframe
src="${facesContext.externalContext.requestContextPath}/richfaces/support/source/usage.html"
class="source_frame"/>
+ </ui:define>
+ </ui:composition>
+</html>
Property changes on:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/support/usage.xhtml
___________________________________________________________________
Name: svn:mime-type
+ text/plain