jsf 验证问题 - 对禁用的输入字段应用必填字段验证

Question

我对应用于禁用字段的 required=true 验证有问题。

我有一个 a4j:commandButton 和两个下拉列表，其中包含表单中的州列表和国家列表。两个下拉列表都应用了 required="true" 验证。使用标签属性 disabled="true" 默认启用 state 下拉菜单，并禁用 country 下拉菜单，如下所示：

<h:selectOneMenu value="#{states}" required="true">
  <f:selectItems>
</h:selectOneMenu>

和

<h:selectOneMenu value="#{countries}" disabled="true" required="true">
  <f:selectItems>
</h:selectOneMenu>

场景#1：点击 a4j:commandButton 而不选择状态下拉列表中的任何内容。 结果：预期状态下拉列表的必填字段验证错误

现在单击单选按钮（在表单外），状态下拉菜单被禁用，国家下拉菜单使用 jquery/javascript 启用，如下所示：

$j('#stateDropdown').attr('disabled', 'disabled');
$j('#countryDropdown').removeAttr('disabled');

场景#2：点击 a4j:commandButton 而不在国家下拉列表中选择任何内容。 结果： 州和国家/地区下拉菜单的必填字段验证错误。但是，预计只会出现国家/地区下拉列表的验证错误。

<h:selectOneMenu>标签在运行时生成的html代码：

使用 jsf 标签属性禁用下拉菜单：<select disabled="disabled">...</select>

对于使用 jquery 禁用的下拉菜单：<select disabled="">...</select>

有人知道为什么 jsf 会验证 jquery 禁用的字段吗？

Answer 1

JSF 根据服务器端的 JSF UIComponent 树进行验证，而不是您所期望的客户端的 HTML DOM 树。使用 jQuery，您只需更改客户端中的 HTML DOM 树而不通知 JSF 有关状态更改，以便它可以在其组件树中反映它。

您必须使用 JSF 而不是 jQuery 来禁用/启用它。当您使用 Ajax4jsf 时，您可以为此使用 a4j:support。

<h:selectOneMenu value="#{bean.state}" required="true">
    <f:selectItems value="#{bean.states}" />
    <a4j:support event="change" reRender="country" />
</h:selectOneMenu>
<h:selectOneMenu id="country" value="#{bean.country}" required="true" disabled="#{bean.countryDisabled}">
    <f:selectItems value="#{bean.countries}" />
</h:selectOneMenu>

在此示例中，<a4j:support> 将在每次更改州下拉菜单时重新呈现国家/地区下拉菜单。国家下拉列表又将其 disabled 属性附加到布尔 bean 属性。您必须确保它根据当前选择的状态返回所需的结果。您可以在 getter 方法或状态下拉列表的 valueChangeListener 中执行此操作。