I have “add address” button, clicking on the button pops up a Jquery Dialog to fill address information with house number, Street, City , County, State, Country and Postal Code.
I would like to start my tabbing from house number but the focus always sets close button on the title bar.
<f:view>
<body onload="sartup()">
<h:form id="form1">
<h:panelGroup >
<h:outputLabel value="House Number" styleClass="label" id="hnoLbl"></h:outputLabel>
<h:inputText id="hnoId" value="#{somebackingbean.address1}"></h:inputText>
</h:panelGroup>
<h:panelGroup>
<h:outputLabel value="Street" styleClass="label" id="streetLbl"></h:outputLabel>
<h:inputText id="streetID" value="#{somebackingbean.address2}" ></h:inputText>
</h:panelGroup>
</h:form>
</body>
</f:view>
I tried setting focus using the following JavaScript:
Function startup(){
document.getElementById("form1:hnoLbl").triggerHandler("focus");
}
and
Function startup(){
document.getElementById("form1:hnoLbl").focus();
}
but it does not work. I prefer using keyboard would like the cursor to directly point at the first text field. What can I do to start tabbing from house number?
Thanks in advance.
Try set it up when the dialog has opened, in the
openevent of the dialog:UPDATE:
According to your comments you cannot execute code from the open event, so try to give focus to the field on a
setTimeout()call that fires once the dialog has already loaded, like this: