The actionListener Attribute
The actionListener Attribute
alt=
"#{bundle.ChooseLocale}"
usemap=
"#worldMap" />
<bookstore:map id=
"worldMap" current="NAmericas"
immediate=
"true" action="bookstore"
actionListener=
"#{localeBean.chooseLocaleFromMap}">
<bookstore:area id=
"NAmerica" value="#{NA}"
onmouseover=
"/template/world_namer.jpg"
onmouseout=
"/template/world.jpg"
targetImage=
"mapImage" />
<bookstore:area id=
"SAmerica" value="#{SA}"
onmouseover=
"/template/world_samer.jpg"
onmouseout=
"/template/world.jpg"
targetImage=
"mapImage" />
<bookstore:area id=
"Germany" value="#{gerA}"
onmouseover=
"/template/world_germany.jpg"
onmouseout=
"/template/world.jpg"
targetImage=
"mapImage" />
<bookstore:area id=
"France" value="#{fraA}"
onmouseover=
"/template/world_france.jpg"
onmouseout=
"/template/world.jpg"
targetImage=
"mapImage" />
</bookstore:map>
...
</h:form>
</f:view>
The alt attribute of graphicImage maps to the localized string "Choose Your Locale from
the Map
".
The actionListener attribute of the map tag points at a method in LocaleBean that accepts an
action event. This method changes the locale according to the area selected from the image
map. The way this event is handled is explained more in
The action attribute specifies a logical outcome String, which is matched against the
navigation rules in the application configuration resource file. For more information on
navigation, see the section
The immediate attribute of the map tag is set to true, which indicates that the default
ActionListener
implementation should execute during the apply request values phase of the
request-processing life cycle, instead of waiting for the invoke application phase. Because the
request resulting from clicking the map does not require any validation, data conversion, or
server-side object updates, it makes sense to skip directly to the invoke application phase.
The current attribute of the map tag is set to the default area, which is NAmerica.
Notice that the area tags do not contain any of the JavaScript, coordinate, or shape data that is
displayed on the HTML page. The JavaScript is generated by the AreaRenderer class. The
Understanding the Image Map Example
Chapter 13 · Creating Custom UI Components
415
