Ajax Action
a4j:ajax
a4j:commandButton
a4j:commandLink
a4j:actionListener
a4j:jsFunction
a4j:poll
a4j:push
a4j:param
Ajax Queue
a4j:queue
a4j:attachQueue
Ajax Output/Containers
a4j:outputPanel
a4j:status
a4j:region
a4j:mediaOutput
a4j:log
Validation
Client Side Validation
rich:graphValidator
rich:message
rich:messages
rich:notify
Data Iteration
a4j:repeat
rich:dataTable
rich:extendedDataTable
rich:collapsibleSubTable
rich:dataScroller
rich:list
rich:dataGrid
Trees
rich:tree
Tree Adaptors
Output/Panels
rich:chart
rich:panel
rich:togglePanel
rich:tabPanel
rich:collapsiblePanel
rich:accordion
rich:popupPanel
rich:progressBar
rich:tooltip
Menus
rich:panelMenu
rich:toolbar
rich:contextMenu
rich:dropDownMenu
Inputs
rich:autocomplete
rich:calendar
rich:editor
rich:inputNumberSlider
rich:inputNumberSpinner
rich:inplaceInput
rich:fileUpload
Selects
rich:inplaceSelect
rich:select
rich:orderingList
rich:pickList
Drag and Drop
Drag and Drop
Miscellaneous
Standard elements skinning
rich:placeholder
RichFaces functions
rich:focus
rich:componentControl
rich:hashParam
rich:hotKey
rich:jQuery

The rich:jQuery component integrates the jQuery JavaScript library into your applications. This allows one to dynamically apply style and behavior to DOM elements as the result of JSF component rendering.

The selector attribute defines an object (or list of objects) against which the query attribute will be applied. The query attribute should be defined with valid JavaScript statements or jQuery api calls.

The jQuery javascript is also accessible via EL using the rich:jQuery EL function.

rich:jQuery can be used in these modes:

  • As a one time query applied immediately or on a document ready event.
  • Define an event handler which is bound to elements returned by selector on some event.
  • As a JavaScript function that can be invoked from custom JavaScript

This example shows how to attach events to the mouseover/mouseout event on the DOM objects. The source below will show how to make them enlarged.


picpicpicpicpicpicpicpicpic