-1

我在 JSF 2 的 xhtml 页面中有以下代码。但是当页面加载时，我收到一个 JavaScript 错误，即 document.getElementById("country") 为空或不是对象。为什么会这样？

<h:form>
    <h:panelGrid columns="2">
        Selected country locale : 
        <h:inputText  id="country" value="#{country.localeCode}" size="20" />
        Select a country {method binding}: 
        <h:selectOneMenu value="#{country.localeCode}" onchange="submit()"
            valueChangeListener="#{country.countryLocaleCodeChanged}">
            <f:selectItems value="#{country.countryInMap}" />
        </h:selectOneMenu>
        <script>
            alert("hi");
            document.getElementById("country").disabled=true;
        </script>
    </h:panelGrid>
</h:form>
4

2 回答 2

0

这似乎是一个命名问题。该字段的 id 未呈现为国家/地区。我发现了一个似乎相关的问题。复合组件和 ID

于 2013-07-18T15:15:37.023 回答
0

它没有找到您的组件。由于您<h:inputText>在其中，<h:form>因此id将具有以下模式 formName:componentName。由于您没有指定idfor <h:form>，JSF 将为您生成一个。这就是为什么您看到formj_id1926454887_72d35e53:country在哪里的原因。如果你想处理更简单，那么你应该为你的. 例如j_id1926454887_72d35e53ididid<h:form>

<h:form id="form">
    <h:inputText  id="country" value="#{country.localeCode}" size="20" /> 
</h:form>

现在的 id<h:inputText>将是form:country.

更简单的是，您可以简单地添加prependId = "false"到您的表单

<h:form prependId="false">

现在你的idfor<h:inputText>将只是country.

如何动态获取此 ID？

我将稍微修改您的代码以实现您想要的（我认为您想禁用input基于特定事件的代码）。考虑这个更简单的例子

<h:form>
    <h:inputText  id="country" value="#{country.localeCode}" size="20" onclick="disableInputText(this.form)" />
</h:form>

在这里，我将一个 javascript 函数附加到一个HTML DOM 事件处理程序。在这种情况下，我希望在input单击它时禁用它（因此onclick）。我也在form函数中传递了作为参考。然后，像这样定义您的 Javascript。

<script>
    function disableInputText(form) {
        form[form.id + ":country"].disabled = true;
    }
</script>

我们只需input在 javascript 中获取对应的idvia 对象form并将其disabled属性设置为true. （您可以将form对象视为Map）。

另请查看下面的链接以获取更多属性<h:inputText>以及您可以使用的不同处理程序（带有onas 前缀的处理程序）。

inputText 标签属性。

此外，查看投票最多的答案，以更全面地了解如何生成 id 以及如何确定它们的其他方式。

我如何知道 JSF 组件的 id 以便可以在 Javascript 中使用

于 2013-07-18T17:00:13.577 回答