1

我在实现 MyFaces 2.0 时使用 JSF。在我的网络应用程序中，我希望页面带有“显示更多”按钮。用户获取页面，只有按钮和带有一些信息的隐藏表单（例如带有标签）。当用户单击此按钮时，他会在显示标签的同一页面上看到。当他再次点击标签应该隐藏。

我的页面.xhtml：

<?xml version='1.0' encoding='UTF-8' ?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core">

<h:head>
</h:head>

<h:body>
    <h:form>
       <h:commandButton value="show more" action="#{bean.showOrHide}">
           <f:ajax render=":formWithLabel"/>
       </h:commandButton>
    </h:form>  
    <hr/>

    <h:form id="formWithLabel" rendered="#{bean.show}">
       <h:outputLabel value="More information"/>
    </h:form>
</h:body>

豆.java：

@ManagedBean
@ViewScoped
public class Bean {

  private boolean show;

  //getters, setters

  public void showOrHide(){
    show = !show;
  }
}

这段代码似乎不起作用。怎么了？

4

1 回答 1

2

确实，这种方法行不通。

<f:ajax render=":formWithLabel"/>作品基本如下：

  1. JavaScript 发送一个 ajax 请求。
  2. JSF 返回一个带有<update id="formWithLabel">更新的 HTML 的 ajax 响应。
  3. JavaScript 用于document.getElementById("formWithLabel")查找元素，以便可以将其内部 HTML 内容替换为来自 ajax 响应的内容。

但是，由于<h:form id="formWithLabel" rendered="#{bean.show}">从来没有首先呈现，JavaScript 无法在 HTML 文档中找到任何内容来用来自 ajax 响应的内容替换内部 HTML 内容，并且静默失败。

您需要将它包装在另一个始终呈现为 HTML 输出的 JSF 组件中，以便 JavaScript 在需要根据 ajax 响应更新 HTML 文档时可以找到它。

<h:form>
   <h:commandButton value="show more" action="#{bean.showOrHide}">
       <f:ajax render=":groupWithLabel"/>
   </h:commandButton>
</h:form>  

<h:panelGroup id="groupWithLabel">
    <h:form id="formWithLabel" rendered="#{bean.show}">
       <h:outputLabel value="More information"/>
    </h:form>
</h:panelGroup>

也可以看看：

与具体问题无关，当您打算在此表单上调用操作时，您可能会偶然发现一个新问题。您可能希望将 与<h:panelGroup>交换<h:form>。

也可以看看：

于 2013-12-02T18:31:05.500 回答