tags:

views:

396

answers:

3

Hi,

I have links and pictures related to these links on my page. I want to do something like, I want to change the pictures everytime when onmouseover event occured in the links. I want to do this in JSF. Please help me.

A lot of Thanks to eveyone.

A: 

You are looking specifically for JSF to do it, or you are open to other Javascript frameworks that provide a slick and easy solution on this? For example Jquery and Dojo etc may be easy to incorporate in your application and will give Rich UI effects.

On the other hand if you are looking at JSF specifically for these UI effects than probably I can try to think of some ways and let you know.

Priyank
Lot of people use Jquery and Yahoo UI in addition to JSF for Rich UI effects. To get more overview of Yahoo UI and Jquery see following links:http://developer.yahoo.com/yui/http://jquery.com/
Priyank
I want to do it using JSF. If you can answer me, I' ll be so glad. There is a difficulty in JSF when I want to get pictures of links because I want to get the pictures from the id of them. This is what I think. But if you have a different approach, it'll be ok then.
To understand more appropriately, you are trying to change the background of link (by using different pictures) for mouse over event or you have a different picture section where you expect the pictures to be displayed to change?
Priyank
I have a table and two columns. In one column I have images and in the other there are links. When mouse over I want to change the picture. I hope I explain it right. ?
A: 

Javascript solution:

Define onmouseover event on the commandLink tag calling some kind of javascript you may give link address from like onmouseover="doSomething('addressOfImage')" then in doSomething javascript method, first find the image, then set src attribute of a default image to given address.

JSF Solution:

You might want to use a4j for this. Add a4j:support to link for onmouseover event then just rerender graphicImage component ofcourse you need to give value of graphicImage dynamically. There is an example of using a4j support below. You can add this a4j:support between your link tags for mouseonover event. Then manage everything on backing bean to handle which image to be displayed.

example

<h:graphicImage id="imageToBeRendered" value="#{myBean.imageAddress}"/>

Just google a4j if you have no idea.

erdemoo
OK. I searched the whole internet and finally I decided to use ICEFaces but I'm trying and trying, could someone give me a full example to this question, cause no amount of searching I did, I couldn't find the answer of these questions: 1.How do you rerender a graphicImage? 2.How could you manage to communicate between javascript and a managed bean?
Are you using a4j in your project? second solution of me is valid if you have that framework in your project, it has a4j:support component with attribute reRender, you tell what should be rerendered at that attribute. btw first solution is the most easiest to implement and i guess more appropriate to your problem.
erdemoo
I'm using ICEFaces now. But If you help me, I can use a4J too.
I edited my answer. If you are using richfaces, then it means you are using a4j.
erdemoo
A: 

JSF isn't designed directly to do this; It's designed to give you the tools to do this yourself. In order to do this you would need to create a custom JSF component to do this and you would use Java script to do it.

You could possibly find a JSF framework that does this already (a4j, IceFaces, etc.) but this is such a simple and well documented JavaScript thing that just tossing a little Java script among your JSF is perfectly acceptable. However, if you don't want to reinvent the wheel, take a look at those other options.

Drew