Question

我正在使用JSF创建一个接口，如果第二个尚未设置，我希望一个文本字段的值提供默认值。关键代码看起来像这样：

<h:outputScript>
function suggestValue2() {
    var value2 = document.getElementById('value2').value;
    if (value2 == "") {
        document.getElementById('value2').value = document.getElementById('value1').value;
    }
}
</h:outputScript>

<h:inputText
    id="value1"
    onblur="suggestValue2();" />

<h:inputText
    id="value2" />

问题是这实际上不起作用。这两个输入元素的实际ID以一些JSF生成的值为前缀，这些值可以调用getElementById个调用。对我来说，完成我想要完成的目标的最佳途径是什么？

<小时/> 编辑：我应该注意，这将出现在复合组件中，这可能会在单个页面上出现多次。 JSF动态设置实际ID表示所需的行为。

Answer 1

将组件绑定到视图

<h:inputText binding="#{input1}" ... />

这样您就可以通过UIComponent#getClientId()在视图中的其他位置打印其客户端ID。

<h:outputScript>
    var input1 = document.getElementById('#{input1.clientId}');
    // ...
</h:outputScript>

正如您所提到的那样，您在复合组件中，可能最好知道复合组件自己的客户端ID已经可以通过#{cc.clientId}获得。因此，更推荐的替代方案是：

<cc:implementation>
    <h:outputScript>
        var input1 = document.getElementById('#{cc.clientId}:input1');
        // ...
    </h:outputScript>
    ...
    <h:inputText id="input1" ... />
    ...
</cc:implementation>

另见：

Integrate JavaScript in JSF composite component, the clean way

Answer 2

Jsf使用一个概念“命名容器”，它表示id在提供的容器中不必是唯一的。如果容器具有Id。因此，如果您没有向容器提供Id，则jsf会在元素之前附加不可预测的值。对于容器的id，它变为containerid：elements id。这可以在JavaScript中可靠地使用

使用Javascript获取JSF定义的组件

2 个答案:

另见：