从Jquery UI对话框中的第一个文本字段设置默认选项卡

时间:2021-07-14 20:04:44

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.

我有“添加地址”按钮,点击按钮弹出一个Jquery对话框,填写房屋号码,街道,城市,县,州,国家和邮政编码的地址信息。我想从门牌号码开始我的标签,但焦点始终在标题栏上设置关闭按钮。

        <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:

我尝试使用以下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.

但它不起作用。我更喜欢使用键盘,希望光标直接指向第一个文本字段。如何从门牌号码开始标记?提前致谢。

1 个解决方案

#1


1  

Try set it up when the dialog has opened, in the open event of the dialog:

在对话框打开时,尝试在对话框的打开事件中进行设置:

$( "#yourdialog" ).dialog({
   open: function() {
      $("#form1:hnoLbl").focus();
   }
});

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:

更新:根据您的评论,您无法从open事件中执行代码,因此请尝试将焦点放在setTimeout()调用的字段上,该调用在对话框已加载后触发,如下所示:

setTimeout(function() {
   document.getElementById("form1:hnoLbl").focus();
}, 400); //adjust the duration accordingly if needed

#1


1  

Try set it up when the dialog has opened, in the open event of the dialog:

在对话框打开时,尝试在对话框的打开事件中进行设置:

$( "#yourdialog" ).dialog({
   open: function() {
      $("#form1:hnoLbl").focus();
   }
});

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:

更新:根据您的评论,您无法从open事件中执行代码,因此请尝试将焦点放在setTimeout()调用的字段上,该调用在对话框已加载后触发,如下所示:

setTimeout(function() {
   document.getElementById("form1:hnoLbl").focus();
}, 400); //adjust the duration accordingly if needed