Div updating with image dynamically..... JSF

Question

How to replace an image in DIV dynamically on click of some other div image as shown in image. Requirement is like that : on click of "DIV1" root should be updated with 1.. on click of "Div2" root should be updated with 2 like that. All div having image loading from some URL and Root is a bigger div. enter image description here

please reply ...

score 2 · Accepted Answer · edited May 23 '17 at 10:30

2

You can do something like this:

<div>
   <h:graphicImage id="root" value="#{managedBean.rootImage}" alt="image"/>
</div>

<div>
   <h:commandLink>
     <h:graphicImage value="images/image1.png" alt="image1"/>
     <f:setPropertyActionListener target="#{managedBean.rootImage}" value="images/image1.png" />
     <f:ajax event="action" render="root"/>  
   </h:commandLink>
</div>

And in your ManagedBean create setter/getters like this:

public class ManagedBean{
    public String rootImage;
    public void setRootImage(String image) {
      this.rootImage= image;
    }
    public String getRootImage() {
      return rootImage;
    }
}

Reference: JSF - Two Questions about actions on UIComponent

edited May 23 '17 at 10:30

Community

1
1

answered Jul 11 '12 at 16:47

Ravi Kadaboina

8,454
3
29
42

is not a valid syntax for jsf what i am using any alternative for this ... which will solve my problem – zytham Jul 12 '12 at 04:13
oh if you are using JSF 1.2 then read this http://stackoverflow.com/questions/3545539/how-do-i-call-a-jsf-action-method-in-jsf-1-2-using-ajax – Ravi Kadaboina Jul 12 '12 at 04:16
is not a valid syntax for jsf ... it is giving message like this... i am using jsf 2.0 – zytham Jul 12 '12 at 04:18
i am using as tag line in my code that is the reason i guess it is giving error .. – zytham Jul 12 '12 at 04:23
See the documentation for syntax at this [link](http://docs.oracle.com/cd/E17802_01/j2ee/javaee/javaserverfaces/2.0/docs/pdldocs/facelets/index.html) – Ravi Kadaboina Jul 12 '12 at 04:40
it worked just i changed ... .jsp to .xhtml in name extension file name – zytham Jul 12 '12 at 07:38
May be you should create a new question and post your XHTML file for us to look at. – Ravi Kadaboina Jul 12 '12 at 13:20

Div updating with image dynamically..... JSF

1 Answers1