使用selectBooleanCheckbox显示/隐藏JSF2表单 [英] Show/hide JSF2 form using selectBooleanCheckbox

问题描述

我正在使用JSF2和Java来构建Web应用程序。我想建立一个如下图所示的表格：

I am using JSF2 and Java to build a web application. I want to build a form like the one at the picture below:

当有人取消选中该复选框时，表单应该消失：

When somebody unchecks the checkbox the form should disappear:

这里是gwt的一个例子。

Here is an example with gwt.

到目前为止，
我在managedBean中使用< f：ajax> 标记和 PropertyActionListener 尝试了一些内容但是它不起作用。有人可以给我一个例子或至少一些提示来实现我的目标。我真的很感激

So far, I tried some stuff with the <f:ajax> tag and an PropertyActionListener in the managedBean but it didn't work. Can somebody give me an example or at least some hints to accomplish my goal. I would be really thankfull

推荐答案

使用< f：ajax event =clickrender =在复选框中@form> 并为包含表单元素的组件提供呈现的属性，该属性取决于复选框的状态。不需要另一个JS代码混乱。

Use <f:ajax event="click" render="@form"> in the checkbox and give the component containing the form elements a rendered attribute which depends on the checkbox's state. No need for another JS code clutter.

<h:form>
    <fieldset>
        <legend>
            <h:selectBooleanCheckbox binding="#{showUserInfo}">
                <f:ajax event="click" render="@form" />
            </h:selectBooleanCheckbox>
            <h:outputText value="User information" />
        </legend>
        <h:panelGroup rendered="#{not empty showUserInfo.value and showUserInfo.value}">
            <p>
                <h:outputLabel for="firstName" value="First name:" />
                <h:inputText id="firstName" value="#{bean.user.firstName}" />
            </p>
        </h:panelGroup>
    </fieldset>
</h:form>

以上示例将复选框绑定到视图，您当然也可以将其绑定到 boolean bean属性，然后你可以从渲染 not empty check c>属性。

The above example binds the checkbox to the view, you can of course also bind it to a boolean bean property, you can then remove the not empty check from the rendered attribute.

            <h:selectBooleanCheckbox value="#{bean.showUserInfo}">

...

        <h:panelGroup rendered="#{bean.showUserInfo}">

这篇关于使用selectBooleanCheckbox显示/隐藏JSF2表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！