Question

我注意到禁用内联p：日历会实际隐藏它。

我一直在期待一个禁用的p：calendar只是一个日历，但是只读，就像所有其他典型的JSF组件一样。

如果我想要一个隐藏的p：日历，我会使用渲染属性。

有没有办法禁用内联p：日历而不隐藏它？（只是为它阻止鼠标和键盘）

Primefaces 4。

Answer 1

毕竟结果是一个跨度，所以你可以使用普通的jQuery来调整样式。

$('.disabledCalendar').children().fadeTo('slow', .7);
$('.disabledCalendar').append('<div style="position: absolute;top:0;left:0;width: 100%;height:100%;z-index:2;opacity:0.4;filter: alpha(opacity = 50)"></div>');
$(".ui-datepicker-inline td").unbind();

并将班级分配给日历：

<p:calendar styleClass="disabledCalendar" mode="inline" />

注意：这可能很棘手，如果有人在客户端使用样式，并删除掩码。他们可以改变价值，因为这个解决方案显然没有反映在服务器端。我会在服务器端进行一些验证，即值没有改变。

修改你也可以将我的解决方案与 Kishor P 答案结合起来并取消绑定事件（我编辑了jQuery的代码）。这样会更安全。

可以在github找到一个小工作示例。还有online Demo。

希望这有帮助。

Answer 2

我使用了readonly=true属性，但它对我没用。

还有一个属性是readonlyInput=true，但这不适用于内联日历。

所以最后我最后解除了通过JQuery附加到<TD> p:calendar组件的所有事件的绑定。

我不知道它是否是一个可行的解决方案（可能还有其他选择），但这个脚本运行得很好。

$(document).ready(
    function makeCalendarReadOnly(){
        $(".ui-datepicker-inline td").unbind();
    }
);

如何禁用内联p：calendar（primefaces）

2 个答案: