3

我有一个表单,在单击复选框之前需要禁用某些字段。对于 JSF 元素都工作正常。问题出在primeface元素上。

对于像下拉列表这样的 JSF 元素,我这样做:

<h:selectOneMenu value="countryValue" disabled="true" id="countryId">
    <f:selectItems value="countries" />
</h:selectOneMenu>

对于 Primefaces-elements,一个像这样的压延机:

<p:calendar disabled="true" id="datePicker" value="dateValue" 
         pattern="yyyy-MM-dd" startWeekday="1"    
            timeZone="GMT">  
</p:calendar>

我用来在事件中启用这些元素的 JavaScript 很简单:

function enableLocationUpdateFilter()
{
    document.getElementById('form:datePicker').disabled = false;
}

jQuery 调用 onchange 事件:

 jQuery('.countryCheckBoxId').change(function()
 {
    enableCountryFilter();
 });

通过调查 firebug 中的 Primefaces 元素,我可以看到 id“datePicker”仅充当“span”id,而 HTML 输入字段的实际 id 是“datePicker_input”。因此,我尝试使用“datePicker_input”在javascript中使用“datePicker”作为ID。这会启用该字段,但显示实际日历的 jQuery 事件不起作用。

似乎日历也是通过 jquery 事件调用的。在这个 jquery-event 中,您可以看到默认禁用设置为 true。我认为这就是问题所在,我不能将那部分设置为假。

4

2 回答 2

4

我能想到的最好的办法是在服务器上调用 Ajax,然后重新渲染日历。你能告诉我们是什么触发了这个 jQuery-onchange 事件吗?

我假设您使用的是 JSF 2.0,对吧?

更新:

因此,您希望在p:calendar单击复选框时启用。与此类似的东西应该可以工作:

<h:selectBooleanCheckbox id="countryCheckBoxId" value="#{bean.countryBoolean}">
   <f:ajax render="datePicker"/>
</h:selectBooleanCheckbox>

<p:calendar disabled="#{!bean.countryBoolean}" id="datePicker" value="dateValue" 
        pattern="yyyy-MM-dd" startWeekday="1" timeZone="GMT">     
</p:calendar>
于 2010-09-27T08:04:53.603 回答
0

由于按下文本字段时会调用日历,因此我尝试了以下操作:

- 将日历禁用变量设置为 false。
- 将日历的输入文本字段禁用属性设置为 true。
- 更改时,将文本字段禁用属性设置为 false。

通过这种方式,日历的 disabled 属性始终设置为 false(意味着它永远不会被禁用),并且我只在渲染时在 javaScript 代码中将文本字段设置为禁用。通过这种方式,您无法触发日历,并且禁用仅适用于文本字段,并且在更改时我再次启用文本字段。

于 2012-05-02T18:32:18.597 回答