PrimeFaces forma zagnieżdżone wewnątrz p: dialog z appendTo = "@ (korpus)

Question

Mam ten fragment:

<h:form id="form"> 

    <!-- other content --> 

    <p:panel id="panel" header="test"> 
     <p:inputText id="input1" value="#{viewScope.prop1}" required="true" /> 
     <p:commandButton id="button1" process="@form" update="@form @widgetVar(dialog)" 
      oncomplete="PF('dialog').show()" value="ok" /> 
    </p:panel> 

    <!-- other content --> 

</h:form> 

<p:dialog id="dialog" header="dialog" widgetVar="dialog" modal="true"> 
    <h:form id="form2"> 
     <p:inputText id="input2" value="#{viewScope.prop1}" required="true" /> 
     <p:commandButton id="button2" process="@form" update="@form" value="ok" /> 
    </h:form> 
</p:dialog> 

i wszystko działa zgodnie z oczekiwaniami

Co chciałbym osiągnąć to jest. :

<h:form id="form"> 

    <!-- other content --> 

    <!-- fragment start --> 
    <!-- this fragment will be on its own file and included via ui:include (or inside composite component) --> 
    <p:panel id="panel" header="test"> 
     <p:inputText id="input1" value="#{viewScope.prop1}" required="true" /> 
     <p:commandButton id="button1" process="@form" update="@form @widgetVar(dialog)" 
      oncomplete="PF('dialog').show()" value="ok" /> 
    </p:panel> 

    <p:dialog id="dialog" header="dialog" widgetVar="dialog" modal="true" appendTo="@(body)"> 
     <h:form id="form2"> 
      <p:inputText id="input2" value="#{viewScope.prop1}" required="true" /> 
      <p:commandButton id="button2" process="@form" update="@form" value="ok" /> 
     </h:form> 
    </p:dialog> 
    <!-- fragment end --> 

    <!-- other content --> 

</h:form> 

ale bezskutecznie próbował jakąś kombinację process i update dla button1 skutkuje niczym procesami ... input1 resetuje się jeszcze ...

A więc, jak zbudować p:dialog, który można wysłać wewnątrz fragmentu lub kompozytu i który jest wyłączony z zewnątrz form?

Należy zauważyć, że przy użyciu:

<h:form id="form"> 

    <!-- other content --> 

    <ui:include src="panel.xhtml" /> 

    <!-- other content --> 

</h:form> 

<ui:include src="dialog.xhtml" /> 

nie jest dopuszczalnym rozwiązaniem.

jestem na JSF 2.2.8 (Mojarra) oraz PF 5.1

Answer 1

Wreszcie znaleźli sposób przy użyciu OmniFaces z <o:moveComponent />:

strony:

<h:form id="form"> 

    <!-- other content --> 

    <ui:include src="/fragment/with/inner/form.xhtml" /> 

    <!-- other content --> 

</h:form> 

fragmentu:

<ui:composition>  
    <p:inputText id="outerText" value="#{viewScope.text}" /> 

    <p:commandButton id="openButton" process="@form" update="@widgetVar(testDialog)" 
     oncomplete="PF('testDialog').show()" value="open" /> 
    <o:moveComponent id="move" for=":#{facesContext.viewRoot.clientId}" destination="ADD_LAST"> 
     <h:form id="innerForm"> 
      <p:dialog id="dialog" widgetVar="testDialog" header="test dialog"> 
       <p:inputText id="innerText" value="#{viewScope.text}" /> 

       <f:facet name="footer"> 
        <p:commandButton id="confirmButton" process="@form" update=":form" 
         oncomplete="if(!args.validationFailed) PF('testDialog').hide()" 
         value="submit" /> 
       </f:facet> 
      </p:dialog> 
     </h:form> 
    </o:moveComponent> 
</ui:composition> 

To spowoduje pewne ostrzeżenie:

WARNING Unable to save dynamic action with clientId 'form:innerForm:dialog' because the UIComponent cannot be found 
WARNING Unable to save dynamic action with clientId 'form:innerForm:innerText' because the UIComponent cannot be found 
WARNING Unable to save dynamic action with clientId 'form:innerForm:confirmButton' because the UIComponent cannot be found 

ponieważ odrestaurowane elementy nie są ponownie usuwane na kolejnym RESTORE_VIEW na odświeżenie strony.

Te ostrzeżenia, podobnie jak w przypadku moich eksperymentów, są nieszkodliwe i można je bezpiecznie zignorować.

Jednak otworzyłem a pull request, aby ostatecznie go naprawić.

Answer 2

używać tylko jednego formularza wewnątrz okna. Działaj dobrze dla mnie.

<h:body> 

<h:form id="OneFormId"> 
    <!-- Some content --> 
</h:form> 

<p:dialog id="MyDialogId" header="My Header Info" 
    widgetVar="MyWidgetVarName" modal="true" appendTo="@(body)"> 
    <h:form id="MyFormId"> 
     <p:outputPanel> 
      <p:messages id="MyMsgId" autoUpdate="true" /> 
      <h:panelGrid columns="2"> 
       <h:outputLabel for="usr" value="User:" /> 
       <p:inputText id="usr" value="#{MyManageBeanName.MyProperty}" 
        required="true" requiredMessage="User is required." /> 
      </h:panelGrid> 
      <p:separator /> 
      <h:panelGrid columns="2"> 
       <p:commandButton value="Save" id="MyBtnSaveId" 
        styleClass="ui-priority-primary" icon="ui-icon-circle-check" 
        process="@form" /> 
       <p:commandButton value="Cancel" id="MyBtnCancelId" 
        onclick="PF('MyWidgetVarName').hide()" 
        styleClass="ui-priority-primary" icon="ui-icon-close" 
        process="MyBtnCancelId" /> 
      </h:panelGrid> 
     </p:outputPanel> 
    </h:form> 
</p:dialog> 

<h:form id="OtherFormId"> 
    <!-- Some content --> 
</h:form>