1

PrimeFaces AJAX と UI:Include に問題があります。タグ ui:include: を使用して、AJAX ベースの Web フォームを作成しようとしています。メニュー ボタンをクリックすると、インクルード時に SRC が変更され、次のページが読み込まれます。すべて正常に動作していますが、ui:include によって読み込まれたページで AJAX を使用しようとすると、更新されません。さて、コードは私が言っていることを示すと思います：

メインページ：

<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">
<f:view contentType="text/html">
    <h:head>
        <f:facet name="first">
            <meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
            <title>PrimeFaces</title>
        </f:facet>
        <ui:include src="#{layout.head}"></ui:include>
    </h:head>
    <h:body>
        <h:form>
        <p:layout fullPage="true" >
            [...]
            <p:layoutUnit position="center">
                <p:panel styleClass="noBorder" id="#{pageFlow.panelId}">
                    <ui:insert name="mainContent">
                        <ui:include src="#{pageFlow.page}"/>
                    </ui:insert>
                </p:panel>
            </p:layoutUnit>
        </p:layout>
        <p:growl id="globalMessages" showDetail="true" severity="warn, error, fatal" autoUpdate="true"></p:growl>
        </h:form>
    </h:body>
</f:view>
</html>

template.xhtml - ロードするページには以下が含まれます。

<ui:fragment
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:p="http://primefaces.org/ui"
  xmlns:ui="http://java.sun.com/jsf/facelets">
    <p:messages  id="resultMessage" showDetail="true" severity="info" autoUpdate="true" closable="true"/>
    <p:panel  styleClass="noBorder">
        <p:panel id="templateBody" header="Cadastro de Template" style="margin: 10px">
            <h:panelGrid cellpadding="3">
                <p:row>
                    <p:column><h:outputLabel value="Nome: "/></p:column>
                    <p:column><p:inputText value="#{template.name}"/></p:column>
                    <p:column><h:outputLabel value="Descrição: "/></p:column>
                    <p:column><p:inputText value="#{template.description}"/></p:column>
                </p:row>
                <p:row><p:column><p:separator/></p:column></p:row>
                <p:row>
                    <p:column><h:outputLabel style="vertical-align: middle" value="Provedor: "/></p:column>
                    <p:column>
                        <p:selectOneMenu style="vertical-align: middle" validator="selectOneMenuValidator" converter="selectOneMenuConverter" id="providers" value="#{template.providerName}">
                            <f:selectItems value="#{template.testItems}"/>
                            <f:attribute name="fieldName" value="template.providerName"/>
                            <p:ajax update="selectAvaliableItems"/>
                        </p:selectOneMenu>
                    </p:column>
                </p:row>
                <p:row>
                    <p:column>
                        <p:panel id="selectItem" styleClass="noBorder" style="alignment-adjust: central; float: left; height: 200px; width: 100%">
                            <p:selectManyMenu converter="selectManyMenuConverter" validator="selectManyMenuValidator" value="#{template.selectedAvaliableItems}" style="float: left; height: 180px; width: 300px" id="selectAvaliableItems">
                                <f:selectItems value="#{template.avaliableItems}"/>
                                <f:attribute name="fieldName" value="template.selectedAvaliableItems"/>
                            </p:selectManyMenu>
                            <p:panel styleClass="noBorder" style="float: left; height: 180px; width: 75px">
                                <p:commandButton value="&gt;&gt;" update="selectItem" actionListener="#{template.setAction(8+0)}"/>
                                <p:commandButton value="&gt;" update="selectItem" actionListener="#{template.setAction(8+1)}"/>
                                <p:commandButton value="&lt;" update="selectItem" actionListener="#{template.setAction(16+1)}"/>
                                <p:commandButton value="&lt;&lt;" update="selectItem" actionListener="#{template.setAction(16+0)}"/>
                            </p:panel>
                            <p:selectManyMenu converter="selectManyMenuConverter" validator="selectManyMenuValidator" value="#{template.selectedChosenItems}" style="float: left;height: 180px; width: 300px" id="selectSelectedItems">
                                <f:selectItems value="#{template.chosenItems}"/>
                                <f:attribute name="fieldName" value="template.selectedChosenItems"/>
                            </p:selectManyMenu>
                        </p:panel>
                    </p:column>
                </p:row>
                <p:row>
                    <p:column>
                        <p:commandButton id="saveBtn" value="Salvar" update="templateBody" action="#{template.sendData}"/>
                    </p:column>
                    <p:column>
                        <p:commandButton value="Cancelar" update="@all" action="home"/>
                    </p:column>
                </p:row>
            </h:panelGrid>
        </p:panel>
    </p:panel>
    <p:blockUI block="templateBody" trigger="saveBtn providers">
            <p:graphicImage value="./files/img/todo/loading.gif" />
    </p:blockUI>
</ui:fragment>

flowPage Bean は正常に機能し、クリックされた MenuButton に基づいてロードされるファイル名を含む文字列を返します。問題は、template.xhtml のすべての AJAX がそのコンテンツを更新しないことです。blockUI が呼び出され、要求を受け取りましたが、コンテンツの更新はありません...

何か案が？

ui:include を削除してテンプレート戦略を使用すると、問題なく動作しますが、AJAX ナビゲーション ページが必要です。

お気遣いありがとうございます。

4

0 に答える 0