Question

我按照BalusC在[这个答案] [1]

中给出的说明

[1]：JSF and f:ajax for hiding/showing 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;">
            ...

Answer 1

只需将包含该按钮的<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>

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

用AJAX显示/隐藏JSF元素后如何隐藏触发元素？

1 个答案: