Hi,
I use h:selectOneRadio tag.
I need to set the cursor focus to first radio field.
<f:view>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<h:form id="focusForm" >
<h:selectOneRadio id="testRadioId" value="">
<f:selectItem id="si1" itemLabel="JSF" />
<f:selectItem id="si2" itemLabel="JSP" />
</h:selectOneRadio>
</h:form>
</body></html></f:view>
here The Firefox (browser) assign id :focusForm:testRadioId:0 that field.
So i use the following script:
document.getElementById("focusForm:testRadioId:0").focus();
But,
Some times, i may change dynamically disable the radio field from backing bean.
<h:selectOneRadio id="testRadioId" value="">
<f:selectItem id="si1" itemLabel="JSF" itemDisabled="true"/>
<f:selectItem id="si2" itemLabel="JSP" />
</h:selectOneRadio>
So here i disable the first radio button.
Now, If i use the same script, then not set cursor focus to first radio field.
how to handle this? that means how to alter my script dynamically during onload?
Please help me.
Thanks in advance.
Update:
Thanks BaluC.
The following code is worked.
<a4j:loadScript src="resource://jquery.js"/>
<script type="text/javascript">
function setFocusRadioField()
{
jQuery(':input:visible:enabled:first').focus();
}
</script>
<body onload="setFocusRadioField();">
</body>
But the following code is not worked. I test the following way:
jQuery('#focusForm\:testRadioId:enabled:first').focus();
Then,
jQuery('#focusForm\\:testRadioId:enabled:first').focus();
Then,
var id = "#focusForm:testRadioId:enabled:first".replace(/:/g, "\\:");
jQuery(id).focus();
I don't know where i make the error. Better, I need set the cursor focus using id. Thanks in advance.