在jsf的更改值侦听器之后将焦点设置为下一个输入元素

时间:2015-06-18 14:26:24

标签: javascript jsp jsf

在我们的一个前端屏幕中,我们有以下布局如下

<h:outputLabel for="firstName" value="first name" />

<h:inputText styleClass="required" id="firstName"  size="30"  maxlength="30" 
        value="#{ownershipStoreInfoController.form.ownerFirstName}" onchange="submit()"
        valueChangeListener="#{ownershipStoreInfoController.useOwnerInfo}">
        <e:validateRegExpr pattern="([A-Z,a-z,0-9,%@()#&amp;,.;:_\$\/\-\{\}\[\]\'\\s*]{1,30})?" />
</h:inputText>


<h:outputLabel for="lastName" value="last name" />

<h:inputText styleClass="required" size="30" id="lastName" maxlength="30"
                    value="#ownershipStoreInfoController.form.ownerLastName}"
                    onchange="submit()"
                    valueChangeListener="#{ownershipStoreInfoController.useOwnerInfo}">
                    <e:validateRegExpr pattern="([A-Z,a-z,0-9,%@()#&amp;,.;:_\$\/\-\{\}\[\]\'\\s*]{1,30})?" />
</h:inputText>

当我在输入字段“firsName”中输入值并输入“Tab”时,更改侦听器被调用,一切看起来都很好。

但问题是它正在进行服务器调用并返回到屏幕。光标到下一个输入框(“lastName”)的焦点不起作用,焦点也会在firstname字段上消失。它工作的唯一方法是我将鼠标手动放在下一个字段中。

我需要专注于进入该领域(“lastName”)。在我更改“firstName”中的值并单击选项卡按钮后。

任何帮助表示赞赏。

1 个答案:

答案 0 :(得分:1)

最后我找到了解决方案。在我的价值变化听众中。我在最后添加了这个声明。

if(event.getComponent().getId().equalsIgnoreCase("COMPONENT ID FIRST")){
        String jsStatement = "document.getElementById(\'" + ("COMPONENT ID SECOND")+ "\').focus();";
        SESSIONCLASS.setBodyOnload(jsStatement);        
    }

在上面的代码&#34; COMPONENT ID FIRST&#34;是触发值更改侦听器的当前组件,&#34; COMPONENT ID SECOND&#34;是您必须设置焦点的下一个组件。

SESSIONCLASS是会话中提供的类,&#34; setbodyonload&#34;是一个接受字符串作为参数的字符串。确保在SESSIONCLASS

中有以下getter和setter方法
public String getBodyOnload() {
    return bodyOnload;
}

public void setBodyOnload(String bodyOnload) {
    this.bodyOnload = bodyOnload;
}

最后我在我的JSP页面中添加了一个scriplet,如下所示。

<%
    String bodyAttributes = "";
    String onload = SESSIONCLASS.getBodyOnload();
    if (onload != null) 
    {
        bodyAttributes = " onload=\""+onload+"\"";
        SESSIONCLASS.setBodyOnload(null); // clear bodyOnload
    }
%>

所以这里当页面加载更改值监听器后。 scriplet执行让焦点在所需的组件上。