JBoss Rich Faces SVN: r7064 - in trunk/samples/richfaces-demo/src/main/webapp/richfaces: componentControl/examples and 3 other directories.
11:04 a.m.
Author: ilya_shaikovsky
Date: 2008-03-21 12:04:02 -0400 (Fri, 21 Mar 2008)
New Revision: 7064
Modified:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/examples/control.xhtml
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/usage.xhtml
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceInput/examples/blockInplace.xhtml
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/selectItems.xhtml
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/simple.xhtml
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/usage.xhtml
Log:
inplaces demos work. and commponent control bug exploring.
Modified:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/examples/control.xhtml
===================================================================
---
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/examples/control.xhtml 2008-03-21
15:51:32 UTC (rev 7063)
+++
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/examples/control.xhtml 2008-03-21
16:04:02 UTC (rev 7064)
@@ -22,7 +22,7 @@
<ui:include src="/templates/include/sourceview.xhtml">
<ui:param name="sourcepath"
value="/richfaces/componentControl/examples/mpusage.xhtml"/>
</ui:include>
- </div>
+ </div>
<p>
<b>Main component attributes:</b>
<ul>
Modified:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/usage.xhtml
===================================================================
---
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/usage.xhtml 2008-03-21
15:51:32 UTC (rev 7063)
+++
trunk/samples/richfaces-demo/src/main/webapp/richfaces/componentControl/usage.xhtml 2008-03-21
16:04:02 UTC (rev 7064)
@@ -1,16 +1,81 @@
-<!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/a4j"
- xmlns:rich="http://richfaces.org/rich">
- <ui:composition template="/templates/component-sample.xhtml">
+<ui:composition template="/templates/component-sample.xhtml"
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/a4j"
+ xmlns:rich="http://richfaces.org/rich">
+
<ui:define name="sample">
- <ui:include
src="/richfaces/componentControl/examples/control.xhtml"/>
+ <style>
+ .atop{
+ vertical-align:top;
+ }
+ </style>
+ <p>RichFaces Component Control is a universal component that allows to call JS
API functions on the
+ components after defined events.
+ </p>
+ <p>
+ In this simple example <b>componentControl</b> components are used to open
and close modal panel.
+ The component is attached to links and calls "show" and "hide"
functions on Modal Panel.
+ </p>
+ <div class="sample-container">
+ <ui:include src="/richfaces/componentControl/examples/mpusage.xhtml"
/>
+ <rich:spacer height="20"/>
+ <ui:include src="/templates/include/sourceview.xhtml">
+ <ui:param name="sourcepath"
value="/richfaces/componentControl/examples/mpusage.xhtml"/>
+ </ui:include>
+ </div>
+ <p>
+ <b>Main component attributes:</b>
+ </p>
+ <ul>
+ <li><b>for</b> - specifies client identifier of the target
component.</li>
+ <li><b>attachTo</b> - specifies client identifier of the component
or id of the existing DOM element that is a source
+ for a given event. If <b>attachTo</b> is not defined, the event is
attached on the server to the closest in the
+ component tree parent component.</li>
+ <li><b>event</b> - is used to trigger the
<b>operation</b> on the target component
+ <br/><i><b>Note:</b> the component could use
"oncontextmenu" event to call the JS API on right click event.
+ But in this case this component should be defined via <b>for</b>
attribute rather than using a4j:support style.
+ In case of support-like definition, the component will not work properly, as many of
the components don't encode this event.
+ </i>
+
+ </li>
+ <li><b>operation</b> - name of the javascript function that will be
invoked on a target component. The API method
+ is attached to the 'component' property of the root DOM element that
represents
+ the target component. The function has two parameters - <b>event</b> and
<b>params</b>.</li>
+ <li><b>params</b> - a set of parameters passed to the function of
Javascript API that will be invoked.
+ The JSON syntax is used to define the parameters, but without open and closed curve
+ bracket.
+ As an alternative, a set of f:param can be used to define the parameters passed to
the
+ API function. </li>
+ </ul>
+ <p>
+ Thus, one of the main features is that Component Control component allows to transfer
+ parameters to managed components.
+ </p>
+ <p>
+ You may put <b>f:param</b> components as nested to component control
component (instead of <b>params</b> attribute usage)
+ and all the parameters that are defined will be available from target component.
+ </p>
+ <p>
+ In the next example, component control is used inside
<b>rich:dataTable</b> component.
+ Component control is defined with two parameters which have the current row values.
+ Hence the <b>rich:contextMenu</b> component that called by this Component
Control
+ will take this parameters and will be able to display them in its items values.
+ </p>
+ <p>
+ Click at any table row to see the context menu that generated individually for
+ every row using parameters.
+ </p>
+ <div class="sample-container">
+ <ui:include src="/richfaces/componentControl/examples/cmenuusage.xhtml"
/>
+ <rich:spacer height="20"/>
+ <ui:include src="/templates/include/sourceview.xhtml">
+ <ui:param name="sourcepath"
value="/richfaces/componentControl/examples/cmenuusage.xhtml"/>
+ </ui:include>
+ </div>
</ui:define>
- </ui:composition>
-</html>
+</ui:composition>
Modified:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceInput/examples/blockInplace.xhtml
===================================================================
---
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceInput/examples/blockInplace.xhtml 2008-03-21
15:51:32 UTC (rev 7063)
+++
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceInput/examples/blockInplace.xhtml 2008-03-21
16:04:02 UTC (rev 7064)
@@ -64,9 +64,8 @@
<f:facet name="header">
<h:outputText value="Data Validation
Results:"></h:outputText>
</f:facet>
- <rich:messages />
- <h:outputText value="All Prices Valid"
- rendered="#{facesContext.maximumSeverity==null}" />
+ <rich:messages style="color:red"/>
+ <h:outputText value="All Prices Currently Valid"/>
</rich:panel>
</h:panelGrid>
</h:form>
Modified:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/selectItems.xhtml
===================================================================
---
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/selectItems.xhtml 2008-03-21
15:51:32 UTC (rev 7063)
+++
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/selectItems.xhtml 2008-03-21
16:04:02 UTC (rev 7064)
@@ -1,10 +1,25 @@
-<ui:composition 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/a4j"
- xmlns:rich="http://richfaces.org/rich">
- <rich:inplaceSelect value="#{inplaceComponentsBean.inputValue}">
- <f:selectItems value="#{capitalsBean.capitalsOptions}"/>
- </rich:inplaceSelect>
+<ui:composition 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/a4j"
+ xmlns:rich="http://richfaces.org/rich">
+ <style>
+ .rich-inplace-select-control-set{
+ margin-top:4px;
+ }
+ </style>
+ <rich:inplaceSelect value="#{inplaceComponentsBean.inputValue}"
+ defaultLabel="Click here to edit"
+ openOnEdit="true" showControls="true"
+ editEvent="ondblclick"
+ controlsHorizontalPosition="left"
+ controlsVerticalPosition="bottom" id="inplaceSelect">
+ <f:facet name="controls">
+ <button onclick="$('inplaceSelect').component.save();"
type="button">Save</button>
+ <button onclick="$('inplaceSelect').component.cancel();"
type="button">Cancel</button>
+ </f:facet>
+ <f:selectItems value="#{capitalsBean.capitalsOptions}" />
+ </rich:inplaceSelect>
+ <rich:spacer width="100%" height="20px"/>
</ui:composition>
\ No newline at end of file
Modified:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/simple.xhtml
===================================================================
---
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/simple.xhtml 2008-03-21
15:51:32 UTC (rev 7063)
+++
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/examples/simple.xhtml 2008-03-21
16:04:02 UTC (rev 7064)
@@ -1,14 +1,15 @@
-<ui:composition 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/a4j"
- xmlns:rich="http://richfaces.org/rich">
- <rich:inplaceSelect value="#{inplaceComponentsBean.inputValue}">
- <f:selectItem itemValue="1" itemLabel="Option 1"/>
- <f:selectItem itemValue="2" itemLabel="Option 2"/>
- <f:selectItem itemValue="3" itemLabel="Option 3"/>
- <f:selectItem itemValue="4" itemLabel="Option 4"/>
- <f:selectItem itemValue="5" itemLabel="Option 5"/>
- </rich:inplaceSelect>
+<ui:composition 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/a4j"
+ xmlns:rich="http://richfaces.org/rich">
+ <rich:inplaceSelect value="#{inplaceComponentsBean.inputValue}"
+ defaultLabel="Click here to edit">
+ <f:selectItem itemValue="0" itemLabel="Option 1" />
+ <f:selectItem itemValue="1" itemLabel="Option 2" />
+ <f:selectItem itemValue="2" itemLabel="Option 3" />
+ <f:selectItem itemValue="3" itemLabel="Option 4" />
+ <f:selectItem itemValue="4" itemLabel="Option 5" />
+ </rich:inplaceSelect>
</ui:composition>
\ No newline at end of file
Modified:
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/usage.xhtml
===================================================================
---
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/usage.xhtml 2008-03-21
15:51:32 UTC (rev 7063)
+++
trunk/samples/richfaces-demo/src/main/webapp/richfaces/inplaceSelect/usage.xhtml 2008-03-21
16:04:02 UTC (rev 7064)
@@ -8,9 +8,17 @@
<ui:composition template="/templates/component-sample.xhtml">
<ui:define name="sample">
- <p>
- SHORT DESCRIPTION
- </p>
+ <p>
+ <b>Inplace Select</b>is a simple input component which displays current
value as
+ <i>outputText </i>and switches to <i>Select </i>based
representation after defined event
+ to allow edit this value.
+ </p>
+
+ <p>
+ You could try simplest example below. Just click on label
+ to edit the value and
+ click somewhere outside the component to store this value(Or just press ENTER
button).
+ </p>
<div class="sample-container" >
<ui:include src="/richfaces/inplaceSelect/examples/simple.xhtml"/>
<ui:include src="/templates/include/sourceview.xhtml">
@@ -18,14 +26,24 @@
</ui:include>
</div>
<p>
- DESCRIPTION
- </p>
+ In this example <i>f:selectItems</i> tag used to define list of items to
be used.
+ Additionally three usefull attributes used:
+ </p>
+ <ul>
+ <li>Controls "save" and "cancel" turned on with
<b>showControls</b> attribute</li>
+ <li style="">
+ <b>openOnEdit</b> with true value defines that select popup list will be
opened
+ automatically after edit state activated.
+ </li>
+ <li><b>editEvent</b> set as <i>ondblclick</i>. So you
should click twice to edit value</li>
+ </ul>
<div class="sample-container" >
<ui:include
src="/richfaces/inplaceSelect/examples/selectItems.xhtml"/>
<ui:include src="/templates/include/sourceview.xhtml">
<ui:param name="sourcepath"
value="/richfaces/inplaceSelect/examples/selectItems.xhtml"/>
</ui:include>
- </div>
+ </div>
+
</ui:define>
</ui:composition>
6696
days inactive
6696
days old
richfaces-svn-commits@lists.jboss.org
0 comments
1 participants
participants (1)
-
richfaces-svn-commits＠lists.jboss.org