I have a link with an image which should change appearance on mouseover and mouseout events:
<af:goLink
destination="javascript:openHelpTextWin('fpw', 'direct_payment');"
onmouseover="document.getElementById(directPaymentForm:image_help).src='/fpw/assets/images /generic_images/help_over.jpg';"
onmouseout="document.getElementById(directPaymentForm:image_help).src='/fpw/assets/images/generic_images/help.jpg';">
<af:objectImage source="/assets/images/generic_images/help.jpg" id="image_help" shortDesc="HELP" width="15" height="14" borderWidth="0"/>
</af:goLink>
It is ADF Faces but that does is not part of the problem in this case.
The rendered html (simplified):
<a
onmouseout="document.directPaymentForm:image_help.src='help.jpg';"
onmouseover="document.directPaymentForm:image_help.src='help_over.jpg';"
class="xl"
href="javascript:openHelpTextWin('fpw', 'direct_payment');">
<img src="help.jpg" border="0" height="14" width="15" id="directPaymentForm:image_help" name="directPaymentForm:image_help"/>
</a>
What causes the problem is the naming container separator char (:). If I change to i.e. underscore it works. Is there a way to change the script to accept the colon? I would not like to change the separator char setting on the naming container.