0

单击 commandLink 时，应出现/呈现 inputTextArea。这是我正在尝试的代码-

<h:form id="MyForm">
<p:commandLink id="OnUseLink" style="text-align: right; vertical-align: bottom;">
 <p:ajax event="click" render=":MyForm:OnUse" ></p:ajax>
 <h:graphicImage styleClass="rollover imgAligntop" style="border:none;" name="plus.gif" library ="images"/>
</p:commandLink>

<p:inputTextarea id="OnUse" size="15"></p:inputTextarea>
</h:form>

有人请帮忙。

4

2 回答 2

1

客户端解决方案

要显示/隐藏元素，请在客户端代码中使用纯 JavaScript/jQuery（示例）/其他 JS 库：

<p:commandLink value="Toggle" onclick="$('#MyForm\\:OnUse').toggle('slow'); return false;" />

服务器端解决方案

要启用/禁用或渲染/不渲染，请在服务器代码中添加适当的标记条件：

<p:commandLink value="Toggle" action="#{bean.action}" update="placeholder" />
<h:panelGroup id="placeholder" layout="block">
    <p:inputTextarea id="OnUse" size="15" rendered="#{bean.rendered}" disabled="#{bean.disabled}" />
</h:panelGroup>

豆：

@ManagedBean
@ViewScoped
public class Bean implements Serializable {
    private boolean rendered = true;//getter
    private boolean disabled = false;//getter
    public String action {
        //use some model condition to derive new rendered property value
        rendered = !rendered;//or disabled = !disabled;
        return null;
    }
}

请务必了解客户端/服务器代码的区别。另请注意，设置 JSF 组件的属性只能在服务器上完成，否则，如果您决定通过 JavaScript 更改它们，更改将不会有任何效果。

于 2013-07-24T08:00:56.547 回答
0

您不需要 p:ajax 来更新组件。
命令按钮本身有一个更新属性。
完成这种情况的常用方法是将 TextArea 放在 PanelGroup 中。
更新面板组并将渲染应用于组件。

并且您不需要引用带有附加到表单 ID [formID:componentId] 的 id 的组件，当它是相同的表单时。

尝试这个 ：

ToggleBean.java

import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;

@ManagedBean
@ViewScoped
public class ToggleBean implements Serializable {

    private boolean renderer=false;

    public boolean isRenderer() {
        return renderer;
    }

    public void setRenderer(boolean renderer) {
        this.renderer = renderer;
    }

    public void buttonAction(){
        renderer = !(renderer);
    }

}

XHTML 页面：

<h:form id="MyForm">
            <p:commandLink id="OnUseLink" style="text-align: right; vertical-align: bottom;" action="#{toggleBean.buttonAction}" value="click" update="usePanelGroup">
                <h:graphicImage styleClass="rollover imgAligntop" style="border:none;" name="plus.gif" library ="images"/>
             </p:commandLink>

            <h:panelGroup id="usePanelGroup">
                <p:inputTextarea id="OnUse" size="15" rendered="#{toggleBean.renderer}" ></p:inputTextarea>
            </h:panelGroup>

        </h:form>

祝你好运。

于 2013-07-24T10:55:02.960 回答