javascript - 使用 JavaScript 启用/禁用rich:calendar 不起作用

Question

我有一个丰富的：日历：

<rich:calendar
  id                  = "endDate"
  value               = ...
  datePattern         = "yyyy-MM-dd"
  enableManualInput   = "true"
  disabled        = "#{detailModel.mode == detailModel.viewMode}"
/>

我想使用 javascript 启用/禁用它。我有以下代码，但它对日历没有影响：

<script type="text/javascript">
 //<![CDATA[ 
  function setDafaults(defType, endDate, startTime)
  {
    var definitionType = defType.options[defType.selectedIndex].text;

    if(definitionType == 'DEFAULT')
    {
       endDate.disabled = true;
       startTime.value =  "#{detailModel.afterObject.getDefaultStartTime()}";
    }
    else
    {
       endDate.disabled = false;
       startTime.value =  '';
    }
  }
 //]]>

</script>

当 selectOneMenu 更改时调用该函数：

...
onchange="setDafaults(document.getElementById('detailForm:definitionType'),
                      document.getElementById('detailForm:endDate'),
                      document.getElementById('detailForm:startTime'))
...

我错过了什么/错误在哪里？

Answer 1

您的错误是您没有通知 JSF 它已启用。disabledJSF 将在处理表单提交期间重新评估该属性。但是，由于您使用 JS 而不是使用 JSF 启用它，因此 JSF 从未被指示它已启用，因此仍认为它已禁用并因此将跳过它。

你基本上有2个选择：

1. 使用 JSF 而不是使用 JS 启用它。
2. 让 JS 设置一些（隐藏的）请求参数，您也可以在disabled属性中检查这些参数。

我会选择 JSF 方式。例如

<h:selectOneMenu value="#{bean.definitionType}">
    <f:selectItem itemValue="DEFAULT" /> 
    <f:selectItem itemValue="NOT_DEFAULT" /> 
    <f:selectItem itemValue="SOME" /> 
    <f:ajax render="endDate" />
</h:selectOneMenu>
<rich:calendar id="endDate" ... disabled="#{bean.definitionType == 'DEFAULT'}" />

基本上就是这样。不需要一些讨厌的 JS。

也可以看看：

• 当 UI 可以由 CSS、HTML、JavaScript、jQuery 实现时，JSF 需要什么？