I am trying out the following piece of code to get access a JSF component in Javascript by referring to its Id. But this fails.
JSF component:
<p:commandLink onclick="calculatePosition(this.id)" >
<h:graphicImage url="2.png"/>
</p:commandLink>
Javascript code:
<script type="text/javascript">
function calculatePosition(idOfClicked){
alert(idOfClicked);
var $element = jQuery('#'+idOfClicked);
var offset = $element.offset();
alert(offset.top);
}
</script>
1st alert works dislaying correct id of the element thereby proving that the JS function is called & correct id has been passed but it fails to display the 2nd alert. This happens only when the id of a JSF component is passed to this JavaScript function but works fine with non JSF components.
How can I make it work correctly ?
See Question&Answers more detail:os