homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

a:visited link not working in JSF
JSF CSS a:visited

 5:37 pm on Oct 20, 2011 (gmt 0)

I have a jsf page where i am looping through a set of data and providing a link in each row to the user for drill down purpose.

rendered="#{!empty searchAction.transactionSearchResults}"

<rich:column headerClass="#{(searchAction.sortBy eq '1')?(searchAction.sortOrder):(blank)}">
<f:facet name="header">
value="NIPR TRANS">
value="1" />

<s:link styleClass="link-color" action="#{searchAction.getAllDetails}" value="#{result.transactionCode}" />

and here is the css for it


a.link-color:visited {

Now the issue is in loop jsf doesn't let me set the id. so when users drill downs row one, it shows the link as red which is fine but if the user comes back to the same page with new results the row one still shows as visited.

I was wondering if some one else have faced this issue and know how to work around this.




 11:04 pm on Oct 20, 2011 (gmt 0)

Ooh, what a fun question.

Advance warning: I will probably never get around to answering the question.

See, this is a generic CSS-link issue. The CSS doesn't know anything about what's on the other end of the link. It only knows whether you have clicked it within the last {period set by user in browser prefs}. So the exact same thing would happen if you clicked on a link to a static www page yesterday, and today the content of the page is entirely different. Your browser doesn't know that.

You can set a single link color, the same whether the link has been visited or not. This may annoy the user. Or you can set a real class-- not a pseudo-class like "visited"-- which changes when your content changes, if and only if the user has seen the content before the most recent change. That is,

link.visited ≠ link:visited


 11:45 am on Oct 24, 2011 (gmt 0)

Thanks for your reply.
I am sorry I am little confused here. Could you please give me an example of the html/jsf part and the css part please. I have named my styleClass="link-color". so what should be the css for this? As you can tell I am pretty new at this. thank you for your help. Also I am not sure what you meant by "link.visited link:visited". What does means?


 2:09 pm on Oct 24, 2011 (gmt 0)

I don't know much about JSF, but from what I can tell the output of this:

<s:link styleClass="link-color" action="#{searchAction.getAllDetails}" value="#{result.transactionCode}" />

Will be something like this:

<a class="link-color" href="#{result.transactionCode}" ...

Where {result.transactionCode} is some dynamic value. The problem is that you're relying on the hash character to provide uniqueness. I think you'll find this is unreliable. If this was using a unique query string value instead, then it might work as you expected (as long as result.transactionCode was unique to each row item). For example:
href="#123" and href="#124" both point to the same resource (which happens to be whatever the current page is), with both referring to some anchor location on that page. Using a querystring instead, you might have:
href="?transactionCode=123" and href="?transactionCode=124", in which case the browser will see these as 2 different resources.

Note, for future reference, you are better off pasting in the HTML source rather than the JSF source, since it's the HTML that ultimately matters, not the JSF.


 2:57 pm on Oct 24, 2011 (gmt 0)

I understand that using a href would resolve this issue but the problem is if i switch to a href I have to pass tons of variables which is other wise injected when i use jsf tags like s:link. That's why i was trying to find a work around (if there are any) for this issue. seems like the only option is for me to switch to regualr a link.


 3:32 pm on Oct 24, 2011 (gmt 0)

seems like the only option is for me to switch to regualr a link

I assume that what you mean by "regular a link" is to use a link that has querystring values instead of trying to rely on the hash. In which case, yes, I believe that is the only option for allowing the browser to recognize them as unique URIs.


 4:43 pm on Oct 24, 2011 (gmt 0)

I meant that the class "visited" (which you would probably want to call by a different name) is not the same as the pseudo-class "visited". A class is something you define yourself based on your own rules; a pseudo-class is intrinsic to CSS.

So if you say a.beenthere {blahblah}

you can write your code to change the class of any given link as needed. Using :visited is trickier.


 4:59 pm on Oct 24, 2011 (gmt 0)

lucy24, where did you see the class "visited" being used? I don't see that in what was posted above.


 5:24 pm on Oct 24, 2011 (gmt 0)

lucy24. could you please provide me with an example code.


 5:26 pm on Oct 24, 2011 (gmt 0)

I thought i was calling it by a class name "link-color"

a.link-color:visited {

and my html code

<s:link styleClass="link-color" action="#{searchAction.getAllDetails}" value="#{result.transactionCode}" />


 5:52 pm on Oct 24, 2011 (gmt 0)

I just re-read the posts above. I think lucy24 was suggesting that you attach classes to elements using JavaScript instead of using the built in :visited pseudo class. In my opinion, that's not a good solution because:

1. It would be totally reliant on JavaScript
2. It would be a lot more work if you were trying to manage which links had been visited and maintain that list across pages


 2:53 am on Oct 25, 2011 (gmt 0)

Yes, my point was that the pseudo-class "visited" alone can't work as desired, because the HTML has no way of knowing whether the visited material has changed. It only knows that the link has been followed.

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved