How to make p:graphicImage clickable and invoke bean action
Solution 1
Wrap your image in a h:commandLink
/ h:link
:
<h:commandLink action="...">
<p:graphicImage id="city"
value="#{countryPages_Setup.countryMap}"
width="250"
height="190">
</p:graphicImage>
</h:commandLink>
Solution 2
If the p:graphicImage is inside a p:contentFlow, you can use the following:
For me, this works perfectly:
<h:form id="imageFlowForm">
<p:contentFlow id="imageContent" value="#{controller.allImages}" var="entry">
<div class="caption">#{entry.name}</div>
<p:commandLink styleClass="content" action="#{controller.doAction}" update="detailForm">
<p:graphicImage value="#{entry.imagePreviewUrl}" styleClass="content" width="50px" />
<f:param name="id" value="#{entry.id}" />
</p:commandLink>
</p:contentFlow>
</h:form>
Basit
A solution-oriented well balanced technical IT Professional with a rich experience of 8 years + in software development covering multiple technologies. I keep atop of new developments within the industry and can adapt quickly to new coding conventions. I am happy working independently or in a close team environment, and apply a positive attitude to every task I undertake. I possess a broad range of technical skills which I refresh on a regular basis, allowing me to respond to new issues with considerable speed.
Updated on July 09, 2022Comments
-
Basit almost 2 years
I am using
<p:graphicImage>
like below:<div id="mapp"> <h3>Country Map</h3> <p:graphicImage id="city" value="#{countryPages_Setup.countryMap}" width="250" height="190"> </p:graphicImage> </div>
But this is not a clickable image. How can I make this image clickable so when user click on it, I can invoke the managed bean action that I want.
-
Basit about 12 years:) Thanks. But can you tell me please why the <a> element is not working? Means <a><p:graphicImage..></a>. Thanks.
-
Matt Handy about 12 years@Basit Do you have the
href
attribute in your anchor tag? -
Basit about 12 yearsno i just tried with <a> not <a href="..">. So is it the reason?
-
Fuzzy Analysis over 8 yearsEnsure that you add the above code into a JSF form in order for it to work.