0

我正在使用 JSF 2.0 和 primefaces 3.3。我想隐藏/显示一个菜单项的工具栏。

这是更多信息。

<p:menubar autoSubmenuDisplay="true" style="width:99%">
                    <p:submenu label="Projects">
                        <p:menuitem id="m11" value="Select Product" actionListener="#{menuBean.renderTool}" update="t1" />
                        <p:menuitem id="m12" value="Select Project" />
                        <p:menuitem id="m13" value="Select Contract" />
                    </p:submenu>
                    <p:menuitem id="m2" value="Global" />

                    <p:menuitem id="m7" value="Exit" />
                </p:menubar>

                <p:toolbar id="t1" rendered="#{menuBean.renderToolbar}">
                    <p:toolbarGroup align="left" style="height:20px;">
                        <h:outputText value="Projects " />
                        <h:outputText value=" - select Product" />
                    </p:toolbarGroup>
                </p:toolbar>

托管豆

private boolean renderToolbar = false;
//getters and setters
public void renderTool(ActionEvent actionEvent){
        System.out.println("inside renderTool method...");
        renderToolbar = true;
    }

actionListener 方法正在执行 但是，它没有更新或呈现工具栏。

4

3 回答 3

2

你提供的信息不多。

但是，一种方法是使用带有onclick事件处理程序的 Javascript。像这样（未经测试的代码）：

<p:toolbar id="toolbarID" />
<p:menu>
    <p:menuitem onclick="$('#toolbarID').toggle();" />
</p:menu>

我认为 primefaces 已经包含 jquery，因此您应该能够开箱即用地使用 jquery 选择器。

于 2012-08-29T09:29:56.063 回答
2

将一些布尔变量添加到您的 bean

boolean someBoolean; //+ getter/setter

并在您的renderToolbar方法中添加

someBoolean = !someBoolean; // toggle the disaplay on and off

在 xhtml 中更改

<p:toolbar id="t1" rendered="#{menuBean.renderToolbar}">

进入

<h:panelGroup id="t1">
    <p:toolbar rendered="#{menuBean.someBoolean}">
.
.
.
</h:panelGroup>
于 2012-08-29T09:51:43.307 回答
1

Daniel 提供的解决方案使用支持 bean 工作。但是，如果显示/显示某些元素不依赖于数据，而更像是客户端的东西或简单的用户控制元素，我建议不要使用支持 bean。为客户端的东西使用支持 bean 会导致延迟，或者正如普通用户所说：“它很慢”。

取而代之的是使用 Jens 建议的 JavaScript 之类的客户端。由于您使用的是 PrimeFaces，因此您可以使用 jQuery。toggle()一个演示 jQuery和函数show()的简单示例：hide()

<h:form>
    <p:menubar>
        <p:menuitem value="Toggle" onclick="$(&quot;[id='t1']&quot;).toggle()" />
        <p:menuitem value="Show" onclick="$(&quot;[id='t1']&quot;).show()" />
        <p:menuitem value="Hide" onclick="$(&quot;[id='t1']&quot;).hide()" />
    </p:menubar>
</h:form>

<p:toolbar id="t1" />

请注意，如果您p:toolbar生活在诸如表单之类的容器中，则客户端 ID 以表单 ID 为前缀。

于 2012-08-29T21:47:02.173 回答