【问题标题】:JSF dynamic include using Ajax request [duplicate]JSF动态包含使用Ajax请求[重复]
【发布时间】:2011-09-07 07:58:58
【问题描述】:

在 JSF2 中,是否可以使用 Ajax 请求动态更改 ui:include 的 src 的值(例如 PrimeFaces p:commandButton)? 谢谢。

<h:form>                        
    <h:commandLink value="Display 2" action="#{fTRNav.doNav()}">
        <f:setPropertyActionListener target="#{fTRNav.pageName}" value="/disp2.xhtml" />
    </h:commandLink>
</h:form>

<ui:include src="#{fTRNav.pageName}"></ui:include>

这就是我现在所拥有的。是否可以使其成为 Ajax(使用 p:commandButton)?

【问题讨论】:

    标签: ajax dynamic include jsf-2 primefaces


    【解决方案1】:

    其他答案中提出的 JSTL 标记不是必需的,并且不能很好地重用。

    这是一个使用纯 JSF 的基本示例(假设您运行 Servlet 3.0 / EL 2.2,否则您确实需要像您的问题一样使用 &lt;f:setPropertyActionListener&gt;):

    <h:form>
        <f:ajax render=":include">
            <h:commandLink value="page1" action="#{bean.setPage('page1')}" />
            <h:commandLink value="page2" action="#{bean.setPage('page2')}" />
            <h:commandLink value="page3" action="#{bean.setPage('page3')}" />
        </f:ajax>
    </h:form>
    
    <h:panelGroup id="include">
        <ui:include src="#{bean.page}.xhtml" />
    </h:panelGroup>
    

    private String page;
    
    @PostConstruct
    public void init() {
        this.page = "page1"; // Ensure that default is been set.
    }
    
    // Getter + setter.
    

    【讨论】:

    • 是的,我正在使用 servlet 3.0,但我不太确定 EL 的版本(我怎么知道?)。我正要问这个问题,因为我绝对不想使用 JSTL。而这个看起来更好。谢谢。
    • EL 2.2 与 Servlet 3.0 齐头并进。因此,只要您的 web.xml 被声明为符合 Servlet 3.0(并且您的 /WEB-INF/lib 中没有任何专有的 el-api.jarel-impl.jar 等),它就可以工作。
    【解决方案2】:

    这是我使用 MnagedBean 动态呈现子内容的方法。首先,我使用private String name="/main_pages/mainpage.xhtml" 在中心设置页面(将由菜单触发器更改),然后每次单击子菜单时,HelloBean 都会重置"name" 并且内容由update=":content" 更新 - 然后从 Bean 检索新名称:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml"
          xmlns:h="http://java.sun.com/jsf/html"
          xmlns:f="http://java.sun.com/jsf/core"
          xmlns:ui="http://java.sun.com/jsf/facelets"
          xmlns:p="http://primefaces.org/ui">
    
    
    
    
            <h:head>
                <f:facet name="first">
                    <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
    
                </f:facet>
            </h:head>
    
            <h:body>
    
                <p:layout fullPage="true">
    
                    <p:layoutUnit position="north" size="150" resizable="true" closable="true" collapsible="true">
                        <h1>Madeline<br>shop</br></h1>
                    </p:layoutUnit>
    
                    <p:layoutUnit position="south" size="100" closable="true" collapsible="true">
                        Zapraszamy do odwiedzania naszego biura!
                    </p:layoutUnit>
    
                    <p:layoutUnit position="west" size="175" header="Menu" collapsible="true">
                        <h:form>
                        <p:menu>
                                <f:ajax render=":content">
                                <p:menuitem value="O naszej agencji" action="#{helloBean.setName('/main_pages/onas.xhtml')}" update=":content" />
                                <p:menuitem value="Ubezpieczenia pojazdów" action="#{helloBean.setName('/main_pages/ubpoj.xhtml')}" update=":content" />
                                <p:menuitem value="Ubezpieczenia majątkowe" action="#{helloBean.setName('/main_pages/ubmaj.xhtml')}" update=":content" />
                                <p:menuitem value="Ubezpieczenia na życie" action="#{helloBean.setName('/main_pages/ubnaz.xhtml')}" update=":content" />
                                <p:menuitem value="Zapytaj" action="#{helloBean.setName('/main_pages/zapytaj.xhtml')}" update=":content" />
                                <p:menuitem value="Kontakt" action="#{helloBean.setName('/main_pages/kontakt.xhtml')}" update=":content" />
                                </f:ajax>
                        </p:menu>
                        </h:form>
                    </p:layoutUnit>
    
                    <p:layoutUnit position="center">
    
                        <br></br><br></br>
                        <p:panel id="content">
                                            <ui:include src="#{helloBean.name}" />
                        </p:panel>       
    
                    </p:layoutUnit>
    
                </p:layout>
    
            </h:body>
    
    
    
    </html>
    

    我的 ManagedBean:

    /*
     * To change this template, choose Tools | Templates
     * and open the template in the editor.
     */
    
    import javax.faces.bean.ManagedBean;
    import javax.faces.bean.RequestScoped;
    import java.io.Serializable;
    /**
     *
     * @author root
     */
    @ManagedBean
    @RequestScoped
    public class HelloBean implements Serializable {
    
        /**
         * Creates a new instance of HelloBean
         */
        private static final long serialVersionUID = 1L;
    
        private String name="/main_pages/mainpage.xhtml";
    
        public String getName() {
            return name;
        }
        public void setName(String name) {
            this.name = name;
        }
    }
    

    【讨论】:

      【解决方案3】:

      您需要在 ui:include 周围使用&lt;c:if test="condition"&gt; 标签,然后当点击 ajax 按钮时,包含 ui:include 的面板会刷新。

      示例

      首先通过在文档中插入以下命名空间来确保包含 jstl 核心标记库:

      &lt;html xmlns:c="http://java.sun.com/jsp/jstl/core&gt;"

      然后,你可以使用&lt;c:if&gt;标签如下:

      <c:if test="#{!logBean.loggedIn}">
          <ui:include src="loginpage.xhtml" />
      </c:if>
      <c:if test="#{logBean.loggedIn}">
          <ui:include src="home.xhtml" />
      </c:if>
      

      【讨论】:

      • 这适用于 ajax 请求吗?
      • 谢谢。它实际上是这样工作的。
      猜你喜欢
      • 2020-06-28
      • 2012-05-17
      • 2012-09-19
      • 2017-02-10
      • 2012-11-24
      • 2012-09-14
      • 2017-04-24
      • 2016-01-13
      • 2016-10-10
      相关资源
      最近更新 更多