Updated - added in <rich:orderingList /> and specify the locale for the calendar
The RichFaces team have released RichFaces 3.1.3.GA. This is the first release since 3.1.0 back in September to include any new components (both 3.1.1 and 3.1.2 were bug fix releases) so I wanted to highlight the key improvements for you.
Time Picker
<rich:calendar value="#{flight.departureDate}"
locale="#{locale}"
datePattern="dd/M/yy hh:mm" />
As you can see, it's also fully internationalisable!
Controlling one component from another
<rich:componentControl /> allows you to fire an action on another component when a javascript event occurs on your current component. This is very powerful, and perhaps hard to understand until you need it, so lets look at a very simple example. Here we have a modal panel (a bit like a css/div based popup), which we want to launch from somewhere in our page:
<rich:modalPanel id="panel" width="350" height="100">
<f:facet name="header">
<h:outputText value="Modal Panel" />
</f:facet>
<h:outputText value="This panel is called using rich:componentControl"/>
</rich:modalPanel>
<h:outputLink value="#"> Show Modal Panel <rich:componentControl for="panel" attachTo="link" operation="show" event="onclick"/> </h:outputLink>
Rather than having to call some JS function, we can just attach a component controller to the link, and tell it what operation to call on what component.
<rich:componentControl /> can do a lot more than this - take a look at the online demo for ideas.
Shuttle list
<rich:listShuttle sourceValue="#{items.availableItems}"
targetValue="#{items.selectedItems}"
var="item"
sourceCaptionLabel="Available Items"
targetCaptionLabel="Currently Active Items">
<rich:column width="18">
<h:graphicImage value="#{item.icon}"/>
</rich:column>
<rich:column>
<h:outputText value="#{item.label}"/>
</rich:column>
</rich:listShuttle>
Notice how we've embedded other rich components to layout the lists!
Orderable list
<rich:orderingList value="#{myMusic}" var="album">
<rich:column>
<f:facet name="header">
Song Name
</f:facet>
<h:outputText value="#{album.title}"/>
</rich:column>
<rich:column>
<f:facet name="header">
Artist Name
</f:facet>
<h:outputText value="#{album.artist.name}" />
</rich:column>
</rich:orderingList>
Context sensitive menu
<s:div id="flower">
<h:graphicImage value="flower.jpg"/>
<rich:contextMenu event="oncontextmenu"
attached="true"
submitMode="none">
<rich:menuItem value="Zoom In"
onclick="enlarge();"/>
<rich:menuItem value="Zoom Out"
onclick="decrease();"/>
</rich:contextMenu>
</s:div>
Here we've attached the context menu to the parent <s:div /> component, so any right click on it causes the menu to show.
There's also
- Big improvements to Portal support (we are just finishing off support for Seam and RichFaces in a portlet)
- A system for customising how styles are loaded (one big lump, or on demand)
- Over 180 bug fixes (see the release notes)
Congratulations to the RichFaces team!
The link to the release notes in your postneeds authentication.
This link works for guest users:
http://labs.jboss.com/wiki/RichFacesWhatIsNewIn3_1_3
Thanks Tom! I updated the post with the correct link :)
If I'm not wrong, in the reoadmap there was something about the possibility to sort a
continue ... to sort a rich:dataTable using a rich:column. Am I wrong or was it postponed?
It looks like rich:calendar's time thingy isn't working. I tried it out, and it never prompts for the time despite the datePattern. I used the exact tag from above. The documentation says
Marco, sorting on a column will be available in 3.2.0 - see RF-279
Jeremy, in tidying up the code to post on the blog I deleted the essential locale attribute - I've added it back into the updated blog.
Sorry about that.
Jeremey, you should then find the time displayed at the bottom of the control, which you can click on.
I need a scroller for a4j:repeat component or simply one jsfdatatable without html table (only with div). i like css zen garden web sites...danke
Will 3.1.3.GA be included in Seam 2.0.1.GA?
Is it on the Livedemo site already?
Because trying to visit that site crashes my Safari 3 on Leopard 10.5.1.
Yes, I updated Seam CVS to use 3.1.3.GA yesterday.
Yes
I checked on Safari 3 on OSX 10.4 and it worked, and I've forwarded your comment to the rest of the RichFaces team.
Yay, things are moving along nicely :-)
The calendar component is not able to localize the labels of all available buttons (e.g. Apply, OK, Cancel) yet, right? If yes, when will this feature be added?
Yes, there is no i8ln on the buttons - this is in the works :)
Here's the issue: RF-1461
Because trying to visit that site crashes my Safari 3 on Leopard 10.5.1.
I checked on Safari 3 on OSX 10.4 and it worked, and I've forwarded your comment to the rest of the RichFaces team.
This is a problem with current versions of the rendering engine used in Safari.
http://www.jboss.com/index.html?module
Hi,
I'm trying to integrate RichFaces with NetBeans6 JSF application (followed chapter 3 in the richfaces DeveloperGuide). However, the components dont seem to be working properly. While viewing in the browser, javascript errors keep popping up and the components are unable to work properly. Any advice on this would be greatly appreciated. Thanks.
I've followed this page and it's working fine!
Pete,
How do I pass a parameter from a h:outputLink to a rich:modalPanel
If I have
<h:ouputLink value="#" id="foo"> <h:outputText value="Foo"/> <rich:componentControl for="fooModal" attachTo="foo" operation="show" event="onclick"> <f:param name="fooparam" value="#{fooVar.item}"> </rich:componentControl>How do I get the fooparam in richModalPanel. Can I pass objects?
Thanks,
Mike.
Click HELP for text formatting instructions. Then edit this text and check the preview.
Hi Mike, did you find out how to do this? I am stuck with exactly the same Problem....
Is there a way to change the items in a menu using rich:componentControl ..or any other mechanism ? I have
in a scrollable data table which launches :
<rich:contextMenu attached="false" id="contextMenu"..> <rich:menuItem ajaxSingle="true" value="..." action="#{some action}"> </rich:menuItem> </rich:contextMenu>Is there a way I can control what menu items are displayed in the context meny ?
rich:componentControl is a javascript call and the context menu is already rendered.
Thanks much.