Use this dialog to create a new image anchor. An image anchor is like an anchor, except that a clickable image replaces clickable text. The <netui:imageAnchor> tag supplies the source code for an image anchor.
In the Page Flow perspective, from the JSP Design Palette drag and drop the image anchor icon into the source view of a JSP page. The image anchor icon is in the section labeled NetUI.
There are four different modes to this dialog, controlled from the Anchor Type dropdown field. Each mode presents a different set of available fields. These modes are:
The following fields are presented in Action mode:
Image Path: the path to the clickable image.
Action: the action method to be invoked.
Parameters: parameters/value pairs will be passed to the
action method as Java parameters.
If the following values are entered into the dialog:
The following NetUI tag set will be created:
<netui:imageAnchor action="getCustomers" src="images/myImages.gif"> <netui:parameter name="param1" value="value1" /> </netui:imageAnchor>
The final HTML will be rendered as follows:
<a href="/CustomerCare/customerManagement/getCustomers.do?param1=value1"><img src="/images/myImages.gif"></a>
Clicking the link will invoke the following action:
@Jpf.Action(...) public Forward getCustomers(String param1) { ... }
The following fields are presented in Hyperlink mode:
Image Path: the path to the clickable image.
URL: the URL (relative or absolute) to link to.
Parameters: parameters/value pairs will added to the URL's
query string (the portion of the URL appended after the '?').
If the following values are entered into the dialog:
The following NetUI tag set will be created:
<netui:imageAnchor href="somePage.jsp" src="images/myImage.gif"> <netui:parameter name="param1" value="value1" /> </netui:imageAnchor>
The following HTML will be rendered (where "CustomerCare" is the project name and "customerManagement" is the path to the page flow):
<a href="/CustomerCare/customerManagement/somePage.jsp?param1=value1"><img src="/CustomerCare/customerManagement/images/myImage.gif"></a>
If the following values are entered into the dialog:
The following NetUI tag set will be created:
<netui:imageAnchor linkName="subsection1" src="images/myImage.gif"></netui:imageAnchor>
The following HTML will be rendered (where "CustomerCare" is the project name and "customerManagement" is the path to the page flow):
<a href="#subsection1"><img src="/CustomerCare/customerManagement/images/myImage.gif"></a>