2

我遵循了 BalusC 在 [this answer][1] 中给出的说明

[1]：JSF 和 f:ajax 用于隐藏/显示 div并且有效。但是我想在按下命令按钮并显示 id="incorrectQuestion" 的元素时隐藏元素。我做了几乎就像在例子中一样。我尝试了很多组合，但我无法隐藏命令按钮。

            <h:panelGroup rendered="#{not answerResultBean.showIncorrectQuestions}">
                <div id="loginDiv" style="width: 400px; text-align: left;">
                    <center>
                        <f:ajax render="incorrectQuestions">
                            <br />
                            <h:commandButton value="#{strings.failedQuestions}"
                                action="#{answerResultBean.setShowIncorrectQuestions(true)}" />
                            <br />
                            <br />
                        </f:ajax>
                    </center>
                </div>
            </h:panelGroup>
            <h:panelGroup id="incorrectQuestions">
                <h:panelGroup rendered="#{answerResultBean.showIncorrectQuestions}">
                    <div id="loginDiv" style="width: 400px; text-align: left;">
            ...
4

1 回答 1

3

只需将<h:panelGroup>包含按钮的内容<h:panelGroup id="incorrectQuestions">也放入其中。这样，它也将根据 ajax 请求进行更新，并且rendered条件会导致它被隐藏。

顺便说一句，尽量保持你的代码干燥。你有很多代码重复。

<h:panelGroup layout="block" id="loginDiv" style="width: 400px; text-align: left;">
    <h:commandButton value="#{strings.failedQuestions}"
        action="#{answerResultBean.setShowIncorrectQuestions(true)}"
        style="text-align: center; margin: 10px;"
        rendered="#{not answerResultBean.showIncorrectQuestions}">
        <f:ajax render="loginDiv">
    </h:commandButton>
    <h:panelGroup rendered="#{answerResultBean.showIncorrectQuestions}">
        ...
    </h:panelGroup>
</h:panelGroup>

请注意， a<h:panelGroup layout="block">生成 a <div>。这样就不需要<h:panelGroup><div>.

于 2013-05-09T20:12:44.487 回答