Question

我对这两个commandButton有问题：加入和离开。

如果我点击离开，我想隐藏加入，反之亦然。

当我把ajax放在false上时，没有问题（但是所有页面都刷新了，我发现这不是最佳的）。

但是当ajax attribut在具有特定更新的情况下为true时（参见代码中的注释），渲染效果良好但新按钮出现变为非活动状态。如果我点击它，没有任何反应（好吧它似乎是actionListener触发但视图没有刷新，我必须手动刷新才能看到差异）

感谢阅读。

<h:form id="formWaitingList" rendered="#{connexion.connected}" >
    <p:commandButton id="Join"  
                    actionListener = "#{connexion.joinWaitingList()}"
                    rendered="#{!connexion.waiting}"
                    ajax="false"
               <!-- ajax="true"
                    update="Join,Leave"-->
                    value="Join"/>

   <p:commandButton id="Leave" 
                    value="Leave"
                    ajax="false"
               <!-- ajax="true"
                    udpate="Join,Leave"-->
                    rendered="#{connexion.waiting}"
                    actionListener ="#{connexion.leaveWaitingList()}" />
</h:form>

Answer 1

您似乎并不完全熟悉HTML / JavaScript。你知道，JSF基本上是一个HTML / JavaScript（/ CSS）代码生成器。 Ajax更新在 JavaScript ：

中的工作原理基本相同

通过XMLHttpRequest向JSF发送ajax请求后，检索XML响应，其中包含需要更新的所有元素及其客户端ID。
对于每个要更新的元素，使用document.getElementById(clientId)在当前的HTML DOM树中查找它。
用ajax XML响应中指定的新元素替换该元素。

但是，如果JSF组件由于rendered="false"而未生成其HTML表示，则HTML DOM树中没有任何内容可以找到并替换。这完全解释了你“看到”的症状。

您基本上需要在HTML表示始终呈现的组件中包装有条件呈现的JSF组件，然后在ajax更新中引用它。

例如，

<h:form>
    ...

    <h:panelGroup id="buttons">
         <p:commandButton ... update="buttons" rendered="#{condition}" />
         <p:commandButton ... update="buttons" rendered="#{not condition}" />
    </h:panelGroup>
</h:form>

另见：

Why do I need to nest a component with rendered="#{some}" in another component when I want to ajax-update it?

在ajax渲染之后，commandButton处于非活动状态

1 个答案: