<p:commandLink > does not invoke the method in the Bean - jsf

hi im trying to save a formular in an Oracle database but when i tried to invoke the method in the action= "#{uniformesBackendBean.refrescarCandidatos()}" but it does not work.. Here is the code. Javascript is able in my browser. Thanks for your help.
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.prime.com.tr/ui"
xmlns:f="http://java.sun.com/jsf/core"
template="/plantillas/defaultTemplate.xhtml"
xmlns:i="http://java.sun.com/jsf/composite/components/presentacion"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:d="http://java.sun.com/jsf/composite/components/dialogo">
<!-- =================================== -->
<ui:define name="titulo">
<h:outputText value="Registro de Uniformes"/>
</ui:define>
<!-- =================================== -->
<ui:define name="acciones">
<p:tab title="Otras acciones">
<h:panelGrid columns="1" style="height: 100px;">
<!-- NUEVO -->
<p:commandLink styleClass="opcionMenu" ajax="true" action="#{reportes$indicador.inicio$action}" >
<p:graphicImage value="/resources/iconos/edit.png"/>
<h:outputText value="Editar" styleClass="espacioTexto"/>
</p:commandLink>
<p:commandLink styleClass="opcionMenu" ajax="true" action="#{uniformesBackendBean.doGuardar()}" rendered="true">
<p:graphicImage value="/resources/iconos/document-save.png"/>
<h:outputText value="Guardar" styleClass="espacioTexto"/>
</p:commandLink>
<p:commandLink styleClass="opcionMenu" ajax="true" action="#{reportes$indicador.inicio$action}">
<p:graphicImage value="/resources/iconos/application-exit.png"/>
<h:outputText value="Cancelar" styleClass="espacioTexto"/>
</p:commandLink>
</h:panelGrid>
</p:tab>
</ui:define>
<ui:define name="contenido">
<p:spacer height="10" />
<h:panelGrid columns="2" > <!--NUEVOS campos para el requerimeinto de cotrol de uniformes -->
<h:inputHidden value="1235" id="inputHidden_1" />
<h:panelGroup >
<h:outputLabel id="nombreEmpleado" value="#{uniformesBackendBean.empleadoSeleccionado.nombreCompleto}" rendered="true" style=" font-weight: bold"/>
<p:commandLink styleClass="opcionMenu"
style="color:blue"
ajax="true"
update="principalForm:tabla"
oncomplete="dialogoEditar.show();"
rendered="true"
action="#{uniformesBackendBean.refrescarCandidatos()}" >
<p:graphicImage value="/resources/iconos/personal.png"/>
<h:outputText value="Seleccionar empleado" styleClass="espacioTexto"/>
</p:commandLink>
</h:panelGroup>
<h:inputHidden value="123" id="inputHidden_23" />
<i:etiquetaRequerido value="Fecha de entrega" />
<p:calendar showOn="button" value="#{reportes$indicador.fechaFinal}" label="Fecha Entrega" title="Fecha Entrega" required="true" requiredMessage="Fecha Entrega es un campo requerido" navigator="true"/>
<i:etiquetaRequerido value="Cantidad de camisas" />
<p:inputText id="cantidadCamisas" value="" size="5"/>
<i:etiquetaRequerido value="Marca de camisa" />
<h:selectOneMenu id="marca" value="" style="width: 175px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Cantidad de camisas es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="Monge"/>
<f:selectItem itemValue="2" itemLabel="Prado"/>
<f:selectItem itemValue="3" itemLabel="Remate"/>
<f:selectItem itemValue="4" itemLabel="Otro"/>
</h:selectOneMenu>
<i:etiquetaRequerido value="Tipo de camisa" />
<h:selectOneMenu id="tipo" value="" style="width: 175px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Tipo de camisa es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="Polo"/>
<f:selectItem itemValue="2" itemLabel="Oxford"/>
<!-- <f:selectItem itemValue="3" itemLabel="Remate"/>
<f:selectItem itemValue="4" itemLabel="Otro"/> -->
</h:selectOneMenu>
<i:etiquetaRequerido value="Talla de camisa" />
<h:selectOneMenu id="talla" value="" style="width: 175px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Talla de camisa es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="S"/>
<f:selectItem itemValue="2" itemLabel="M"/>
<f:selectItem itemValue="3" itemLabel="L"/>
<f:selectItem itemValue="4" itemLabel="XL"/>
<f:selectItem itemValue="5" itemLabel="XXL"/>
</h:selectOneMenu>
<i:etiquetaRequerido id="valorUniforme" value="Valor"/>
<p:inputText id="valor" value="" required="true" requiredMessage="Valor es un campo requerido" />
<i:etiquetaRequerido id="aplicaDes" value="Aplica Descuento"/>
<h:selectOneMenu id="aplicaDescuento" value="" style="width: 120px; height: 24px; padding-top: 3px;" required="true" requiredMessage="Aplica descuento es un campo requerido" styleClass="ui-widget ui-inputfield ui-state-default ui-corner-all">
<f:selectItem itemValue="0" itemLabel="-- Seleccione --"/>
<f:selectItem itemValue="1" itemLabel="Si"/>
<f:selectItem itemValue="2" itemLabel="No"/>
<!--<f:selectItem itemValue="3" itemLabel="L"/>
<f:selectItem itemValue="4" itemLabel="XL"/>
<f:selectItem itemValue="5" itemLabel="XXL"/> -->
</h:selectOneMenu>
<h:outputText id="observaciones" value="Observaciones"/>
<p:inputTextarea cols="20" rows="2" value=""/>
<i:etiquetaRequerido value="Tipo de planilla" />
<h:selectOneMenu id="LstTipoPlanilla" style="height: 25px;padding-top: 3px;width: 200px;" required="true" requiredMessage="Tipo de planilla es un campo requerido" label="Tipo Planilla" value="#{reportePlanilla.tipoPlanilla}" >
<f:selectItem itemValue="-1" itemLabel="[ SELECCIONE TIPO PLANILLA ]" />
<f:selectItems value="#{reportePlanilla.listaTipos}" var="tipo" itemValue="#{tipo.tiposPlanillaPK.codTipopla}" itemLabel="#{tipo.nomTipopla}"/>
</h:selectOneMenu>
<i:etiquetaRequerido value="Programación planilla" />
<p:inputText id="planilla" required="true" requiredMessage="Planilla es un campo requerido" />
</h:panelGrid> <!-- ES EL MAS EXTERNO -->
<p:spacer height="10" />
</ui:define>
<ui:define name="dialogos">
<p:dialog widgetVar="dialogoEditar" header="Editar candidato" modal="true" draggable="true" resizable="false" closable="true" width="650">
<p:dataTable id="tablaEmpleados" value="#{uniformesBackendBean.empleadosListModel}" var="empleado" rows="5" paginator="true" paginatorAlwaysVisible="true" pageLinks="5" onRowSelectUpdate="principalForm:editarAceptarCommandButton" onRowUnselectUpdate="principalForm:editarAceptarCommandButton" emptyMessage="No se han encontrado Empleados.">
<f:facet name="header">
<h:outputText value="Empleados"/>
</f:facet>
<p:column headerText="ID " filterBy="#{empleado.empleadosPK.codEmp}" filterMatchMode="contains" style="width: 10%;" >
<h:outputText value="#{empleado.empleadosPK.codEmp}"/>
</p:column>
<p:column headerText="Nombre del empleado" filterBy="#{empleado.nombreCompleto}" filterMatchMode="contains">
<h:outputText value="#{empleado.nombreCompleto}"/>
</p:column>
<p:column headerText="Seleccionar" style="width: 8%;" >
<p:commandButton id="editarAceptarCommandButton" image="ui-icon ui-icon-circle-check" onclick="dialogoEditar.hide();"
action="#{planilla$empleado.editar$action}" update="principalForm:mensajes principalForm:panelAcciones principalForm:panelContenido principalForm:nombreEmpleado" title="Seleccionar empleado" >
<f:setPropertyActionListener value="#{empleado}" target="#{uniformesBackendBean.empleadoSeleccionado}" />
</p:commandButton>
</p:column>
</p:dataTable>
<h:panelGrid columns="2">
<p:commandButton id="editarCancelarCommandButton" value="Cancelar" image="ui-icon ui-icon-circle-close" onclick="dialogoEditar.hide();"
action="#{planilla$empleado.cancelar$action}" update="principalForm:mensajes principalForm:panelAcciones principalForm:panelContenido"/>
</h:panelGrid>
</p:dialog>
</ui:define>
</ui:composition>

Did you tried like action= "#{uniformesBackendBean.refrescarCandidatos}".
Without using () small braces?
And your button or link should be inside <h:form>...</h:form> tag.
Example:
<h:form>
<p:commandLink styleClass="opcionMenu"
style="color:blue"
ajax="true"
update="principalForm:tabla"
oncomplete="dialogoEditar.show();"
rendered="true"
action="#{uniformesBackendBean.refrescarCandidatos}" >
<p:graphicImage value="/resources/iconos/personal.png"/>
<h:outputText value="Seleccionar empleado" styleClass="espacioTexto"/>
</p:commandLink>
</h:form>

Related

primefaces selectOneMenu not working in Dialog

I have this dialog:
The code for this dialog:
<p:dialog header="Détails du produit" showEffect="fade" modal="true"
widgetVar="manageProductDialog" responsive="true">
<p:outputPanel id="manage-product-content" class="ui-fluid">
<p:outputPanel rendered="#{not empty productMB.selectedProduct}">
<p:graphicImage
name="images/product/#{productMB.selectedProduct.img}"
library="demo" styleClass="product-image"
rendered="#{not empty productMB.selectedProduct.img}" />
<div class="p-field">
<p:outputLabel for="name">Nom</p:outputLabel>
<p:inputText id="name" value="#{productMB.selectedProduct.name}"
required="true" />
</div>
<div class="p-field">
<p:outputLabel for="category">Catégorie</p:outputLabel>
<p:selectOneMenu id="category"
value="#{productMB.selectedProduct.category}"
layout="responsive">
<f:selectItem itemLabel="Select One" itemValue="#{null}" noSelectionOption="true" />
<f:selectItems value="#{categoryMB.categories}" var="cat" itemValue="#{cat}" itemLabel="#{cat.name}" />
</p:selectOneMenu>
</div>
<div class="p-formgrid p-grid">
<div class="p-field p-col">
<p:outputLabel for="price">Prix</p:outputLabel>
<p:inputNumber id="price"
value="#{productMB.selectedProduct.price}" symbol=" DH"
symbolPosition="s" decimalSeparator="." thousandSeparator="," />
</div>
</div>
</p:outputPanel>
</p:outputPanel>
<f:facet name="footer">
<p:commandButton value="Enregister" icon="pi pi-check"
actionListener="#{productMB.saveProduct}"
update="manage-product-content"
process="manage-product-content #this" />
<p:commandButton value="Annuler" icon="pi pi-times"
onclick="PF('manageProductDialog').hide()"
class="ui-button-secondary" />
</f:facet>
</p:dialog>
The problem I have is that when I click on Enregister button the p:selectOneMenu is not validated even that a value was selected.
How can I solve this issue ?

MenuItem must be inside a form element BUT Form already exist

I'm working on primefaces and i can't understand this error.
My all xhtml code
My xhtml code :
<ui:composition template="/layout/template.xhtml"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
>
<ui:define name="content">
<h:form id="formTab">
<p:commandButton value="Ajouter" oncomplete="PF('addNewDialog').show()" />
<p:dataTable var="tasktype" value="#{taskTypeBean.allTaskTypes}" id="taskType" selection="#{taskTypeBean.selectedTaskType}" selectionMode="single" rowKey="#{tasktype.reference}">
<p:column headerText="Reference">
<h:outputText value="#{tasktype.reference}" />
</p:column>
<p:column headerText="Description">
<h:outputText value="#{tasktype.description}" />
</p:column>
<p:column headerText="Prix Hors Taxe">
<h:outputText value="#{tasktype.htPrice}" />
</p:column>
</p:dataTable>
<p:contextMenu for="taskType">
<p:menuitem value="Modifier" action="#{taskTypeBean.updateDialog()}" update=":updateForm:udpatePanel" />
<p:menuitem value="Supprimer" action="#{taskTypeBean.deleteTaslType()}" update="taskType" />
</p:contextMenu>
</h:form>
<p:dialog widgetVar="updateDialog" modal="true" appendTo="#(body)">
<h:form id="updateForm">
<p:growl id="growlModif" showDetail="true" sticky="true" />
<p:panelGrid columns="2" id="udpatePanel">
<p:outputLabel for="reference" value="Reference :"/>
<p:inputText id="reference" required="true" requiredMessage="Entrez une reference" disabled="true" value="#{taskTypeBean.taskToUpdate.reference}"/>
<p:outputLabel for="description" value="Description :"/>
<p:inputText id="description" required="true" requiredMessage="Entrez une description" value="#{taskTypeBean.taskToUpdate.description}"/>
<p:outputLabel for="HTprice" value="HTprice :"/>
<p:inputText id="HTprice" required="true" requiredMessage="Entrez un prix hors taxe" value="#{taskTypeBean.taskToUpdate.htPrice}"/>
<p:commandButton value="Modifier" id="modifier" action="#{taskTypeBean.updateTaskType}" update=":formTab:taskType" oncomplete="PF('updateDialog').hide()" styleClass="ui-priority-primary" />
</p:panelGrid>
</h:form>
</p:dialog>
<p:dialog widgetVar="addNewDialog" modal="true" appendTo="#(body)">
<h:form>
<p:growl id="growlAdd" showDetail="true" sticky="true" />
<p:panelGrid columns="2">
<p:outputLabel for="reference" value="Reference :"/>
<p:inputText id="reference" required="true" requiredMessage="Entrez une reference" value="#{taskTypeBean.newReference}"/>
<p:outputLabel for="description" value="Description :"/>
<p:inputText id="description" required="true" requiredMessage="Entrez une description" value="#{taskTypeBean.newDescription}"/>
<p:outputLabel for="HTprice" value="HTprice :"/>
<p:inputText id="HTprice" required="true" requiredMessage="Entrez un prix hors taxe" value="#{taskTypeBean.newHTprice}"/>
<p:commandButton value="Ajouter" id="ajouter" action="#{taskTypeBean.addNewTaskType}" update=":formTab:taskType" oncomplete="PF('addNewDialog').hide()" styleClass="ui-priority-primary" />
</p:panelGrid>
</h:form>
</p:dialog>
</ui:define>
There is 3 differents form in this page
So, we can see and i have this issue :
javax.servlet.ServletException: MenuItem must be inside a form element
javax.faces.webapp.FacesServlet.service(FacesServlet.java:606)
org.apache.tomcat.websocket.server.WsFilter.doFilter(WsFilter.java:52)
I built this page with an template very basic, i can't understand this problem.
Thanks for your help

Primefaces datatable paginator is not affected by page's layout changes

I am using Primefaces 4.0 Datatable with a paginator. The table lies right under a
accordionPanel wich can expand or collapse, affecting the layout of the page.
Unfortunately, the paginator of the datatable doesn't move when the accordion animation is performed.
BEFORE EXPANDING the accordion:
AFTER EXPANDING the accordion:
I have kinda taken the code from primefaces showcase, and didn't touch it much, but anyway here's what is in my xhtml:
Any idea of what i'm doing wrong?
TABLE CODE:
<p:dataTable id="idDataTable" value="#{analysisBean.listOfSamu}" var="nthSamu" rows="10"
paginator="true"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
selectionMode="single">
<p:column headerText="ID" sortBy="#{nthSamu.idSamu}" filterBy="#{nthSamu.idSamu}" filterMatchMode="contains">
<h:outputText value="#{nthSamu.idSamu}"/>
</p:column>
<p:column headerText="EJE" sortBy="#{nthSamu.nombre}" filterBy="#{nthSamu.nombre}" filterMatchMode="contains">
<h:outputText value="#{nthSamu.nombre}"/>
</p:column>
<p:column headerText="EJE" sortBy="#{nthSamu.primerApellido}" filterBy="#{nthSamu.primerApellido}" filterMatchMode="contains">
<h:outputText value="#{nthSamu.primerApellido}"/>
</p:column>
<p:column headerText="IM" sortBy="#{nthSamu.importe}" filterBy="#{nthSamu.importe}" filterMatchMode="contains">
<h:outputText value="#{nthSamu.importe}"/>
</p:column>
<p:column headerText="FE" sortBy="#{nthSamu.fecha}" filterBy="#{nthSamu.fecha}" filterMatchMode="contains">
<h:outputText value="#{nthSamu.fecha}"/>
</p:column>
</p:dataTable>
ACCORDION CODE:
enter code her <p:fieldset legend="Filtros" style="width: 40%" >
<h:panelGrid columns="1">
<p:accordionPanel multiple="true" style="width: 100%">
<p:tab title="Acerca del Giro">
<h:panelGrid columns="5">
<h:column>
<h:outputLabel style="vertical-align:middle" value="Oficina: " />
<p:selectOneMenu id="oficinaSelect" style="vertical-align:middle">
<f:selectItem itemLabel="Todos" itemValue="Todos" />
<f:selectItem itemLabel=" Naguaes" itemValue=" Naguaes" />
<f:selectItem itemLabel=" aguaes" itemValue=" aguaes" />
<f:selectItem itemLabel="Naguaes" itemValue=" s Naguaes" />
<f:selectItem itemLabel="aguaes" itemValue=" s aguaes" />
</p:selectOneMenu>
</h:column>
<h:column>
<h:outputLabel style="vertical-align:middle" value="País: "/>
<p:selectOneMenu id="paisSelect" style="vertical-align:middle">
<f:selectItem itemLabel="Todos" itemValue="Todos" />
<f:selectItem itemLabel="Naguaes" itemValue=" Naguaes" />
<f:selectItem itemLabel="aguaes" itemValue=" aguaes" />
<f:selectItem itemLabel="Naguaes" itemValue=" s Naguaes" />
<f:selectItem itemLabel="aguaes" itemValue=" s aguaes" />
</p:selectOneMenu>
</h:column>
</h:panelGrid>
</p:tab>
<p:tab title="Acerca del Ejecutor">
<h:panelGrid columns="5">
<p:graphicImage url="images/usericon.png" width="30" height="30" style="border: 3px solid activecaption"/>
<h:column>
<h:outputLabel value="Naguaidad:" style="vertical-align:middle"/>
<p:selectOneMenu id="idNaguaidadSelect2" style="vertical-align:middle">
<f:selectItem itemLabel="Todos" itemValue="Todos" />
<f:selectItem itemLabel="aguaes" itemValue=" Naguaes" />
<f:selectItem itemLabel="guaes" itemValue=" aguaes" />
<f:selectItem itemLabel="Naguaes" itemValue=" s Naguaes" />
<f:selectItem itemLabel="aguaes" itemValue=" s aguaes" />
</p:selectOneMenu>
</h:column>
<h:column>
<h:outputLabel value=" Porto NInj:" style="vertical-align:middle" />
<p:selectOneMenu id="id PortoNInjSelect" style="vertical-align:middle">
<f:selectItem itemLabel="Todos" itemValue="Todos" />
<f:selectItem itemLabel="aguaes" itemValue=" Naguaes" />
<f:selectItem itemLabel="guaes" itemValue=" aguaes" />
<f:selectItem itemLabel="Naguaes" itemValue=" s Naguaes" />
<f:selectItem itemLabel="aguaes" itemValue=" s aguaes" />
</p:selectOneMenu>
</h:column>
<h:column>
<h:outputLabel value="Actividad:" style="vertical-align:middle"/>
<p:selectOneMenu id="idActividadSelect" style="vertical-align:middle">
<f:selectItem itemLabel="Todos" itemValue="Todos" />
<f:selectItem itemLabel=" Naguaes" itemValue=" Naguaes" />
<f:selectItem itemLabel=" aguaes" itemValue=" aguaes" />
<f:selectItem itemLabel=" s Naguaes" itemValue=" s Naguaes" />
<f:selectItem itemLabel=" s aguaes" itemValue=" s aguaes" />
</p:selectOneMenu>
</h:column>
</h:panelGrid>
</p:tab>
</p:accordionPanel>
<p:commandButton id="idFiltrarCommandButton2" style="float:right" icon="ui-icon-search" value="Filtrar" action="#{analysisBean.populateList()}" update="idDataTable"></p:commandButton>
</h:panelGrid>
</p:fieldset>
I'm fairly with prime-faces. Seems like you need to have the dataTable and the accordionPanel within two seperate forms and panels. I would recommend doing something like,
Code:
<Dialogue>
<Form1>
<Panel>
Datatable
</panel>
</Form1>
<Form2>
<panel>
AccordionPanel
</panel>
</Form2>
</Dialogue>
just don't forget to update the respective forms accordingly

p:selectOneMenu keeps deselecting

I have a bug, I have in a page, 3 <p:selectOneMenu>s and 1 <p:selectManyMenu>
They work in order, I select the first, it fills the second, the secon fill the third and the third fill s the <p:selectManyMenu>. When I start to Select the values in the <p:selectManyMenu>(holding the ctrl button) the third <p:selectOneMenu> deselects. Executing the function that fills the <p:selectManyMenu>.
Anyone have ever seen this?
I'have a lot of experience with java, but just started with JSF and PrimeFaces.
Thank you all in advance.
<ui:composition 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"
xmlns:p="http://primefaces.org/ui">
<h:form id="formPatch">
<table border="">
<tr>
<td height="180p" valign="top">
<p:panel header="Configurar diretórios para extrair Objetos do Patch" style="width: 500px; height: 170px">
<h:panelGrid columns="2">
<p:outputLabel value="Arquivo: " styleClass="format_label"
for="nomePatch" />
<p:inputText id="nomePatch" value="#{patchMB.patchBean.fileName}" styleClass="format_input" required="true"
requiredMessage="Favor preencher o campo nome do arquivo ex: confg.txt">
</p:inputText>
<p:outputLabel value="Repositórios:" styleClass="format_label" for="dirRep" />
<p:selectOneMenu id="dirRep" value="#{patchMB.patchBean.directoryRepositorio}"
style="width: 350px">
<p:message for="dirRep" />
<f:selectItem itemLabel="Selecione" itemValue="Selecione" />
<f:selectItems value="#{patchMB.directoryRepCli}" />
<f:ajax event="change" listener="#{patchMB.carregaDirProdCli}" render="dirProdCli" />
</p:selectOneMenu>
<p:outputLabel value="Prod/Clientes: " for="dirProdCli" />
<p:selectOneMenu id="dirProdCli" value="#{patchMB.patchBean.directoryProdCli}"
style="width: 350px">
<p:message for="dirGap" />
<f:selectItem itemLabel="Selecione" itemValue="Selecione" />
<f:selectItems value="#{patchMB.dirProdCli}" />
<f:ajax event="change" listener="#{patchMB.carregaDirObjetos}" render="dirObj" />
</p:selectOneMenu>
<p:outputLabel value="Dir objetos: " for="dirObj" />
<p:selectOneMenu id="dirObj" value="#{patchMB.patchBean.directoryObjetos}"
style="width: 350px">
<p:message for="dirObj" />
<f:selectItem itemLabel="Selecione" itemValue="Selecione" />
<f:selectItems value="#{patchMB.dirObjetos}" />
<f:ajax event="change" listener="#{patchMB.carregarFiles}" render="pickListArq" />
<f:ajax event="change" listener="#{patchMB.carregarSelectMany}" render="objSelectMany" />
</p:selectOneMenu>
</h:panelGrid>
</p:panel>
</td>
<td>
<p:panel header="Escolha os arquivos para criação do patch" style="width: 500px">
<p:tab id="pickListTab" title="Transformadores">
<h:panelGrid columns="1">
<p:pickList id="pickListArq" value="#{patchMB.objetos}" var="pickListObj"
itemLabel="#{pickListObj}" itemValue="#{pickListObj}">
<f:facet name="sourceCaption">Selecione os objetos</f:facet>
<f:facet name="targetCaption">Objetos do Patch</f:facet>
</p:pickList>
</h:panelGrid>
</p:tab>
</p:panel>
</td>
</tr>
</table>
</h:form>
</ui:composition>

primefaces north layout unit disappears on dialogue's resize

i was developing my jsf web app using primefaces framework, and i come across to this strange behavior, when i resize the dialogue on my page the north layout unit disappears, what is more strange is when i resize the inspector on any browser it does same bizarre behavior , it just disappears, i wanna know what i'm doing wrong.
here a some substantial code :
<h:body>
<f:view>
<h:form id="form1">
<p:layout id="layout">
<p:layoutUnit id="north" position="north" resizable="false" header="Recherche avancé" collapsible="false" effect="drop" collapsed="false" size="140">
<p:panelGrid columns="4" styleClass="prince">
<p:panel styleClass="centeredPanelDate" header="Dates">
<p:panelGrid styleClass="centeredPanelDatePan" columns="2">
<p:selectOneMenu id="stater" value="#{dyna.dateOption}" style=" height:20px!important;
width: 140px;
font-family: klavika_boldbold;">
<f:selectItems value="#{dyna.etatdateOptions}"/>
</p:selectOneMenu>
</p:panelGrid>
<p:panelGrid columns="2" >
<p:column>
<p:outputLabel id="lab1" value= "De : " for="popupButtonCal1" />
<p:outputLabel id="lab2" value= "A : " for="popupButtonCal2"/>
</p:column>
<p:column>
<p:calendar value="#{dyna.startdate}"
id="popupButtonCal1"
validatorMessage="format de date invalide"
pattern="dd/MM/yyyy HH:mm"
mode="popup"
locale="fr"
navigator="true"
effect="show"
mindate="01/01/1988"
maxdate="31/12/2030"
showButtonPanel="true"
styleClass="calo"/>
<br></br>
<p:calendar value="#{dyna.enddate}"
id="popupButtonCal2"
validatorMessage="format de date invalide"
pattern="dd/MM/yyyy HH:mm"
mode="popup"
locale="fr"
navigator="true"
effect="show"
mindate="01/01/1988"
maxdate="31/12/2030"
showButtonPanel="true"
styleClass="calo"/>
</p:column>
</p:panelGrid>
<p:tooltip for="popupButtonCal1" value="Date de debut (selectionner une date sur la calendrier" showEffect="clip" hideEffect="clip"/>
<p:tooltip for="popupButtonCal2" value="Date de fin (selectionner une date sur la calendrier" showEffect="clip" hideEffect="clip"/>
</p:panel>
<p:panel styleClass="listsPanel" header="Listes">
<p:panelGrid styleClass="centeredPanelDatePan1" columns="3" >
<p:column>
<p:selectCheckboxMenu label="Etat" value="#{dyna.selectedstateOptions}" style=" height:18px!important;width: 100px;font-family: klavika_boldbold; ">
<f:selectItems value="#{dyna.etatExamOptions}" />
</p:selectCheckboxMenu>
</p:column>
<p:column >
<p:selectCheckboxMenu label="Payement" value="#{dyna.selectedpayOptions}" style=" height:18px!important;width: 100px;font-family: klavika_boldbold;">
<f:selectItems value="#{dyna.payExamOptions}" />
</p:selectCheckboxMenu>
</p:column>
<p:column >
<p:selectCheckboxMenu label="Salle" value="#{dyna.selectedsalleOptions}" style=" height:18px!important;width: 100px;font-family: klavika_boldbold;">
<f:selectItems value="#{dyna.salleOptions}" />
</p:selectCheckboxMenu>
</p:column>
</p:panelGrid>
</p:panel>
<p:panel styleClass="param" header="Paramètre resultat">
<p:panelGrid styleClass="param1" columns="3" >
<p:column>
<p:inputText id="txt1" value="#{dyna.number1}" />
<p:slider id ="sld" for="txt1" minValue="10" maxValue="1000" />
</p:column>
<h:column>
<p:commandButton id="searchdate" value="Rechercher" actionListener="#{dyna.search}" style="height:30px!important"/>
</h:column>
</p:panelGrid>
<p:tooltip for="txt1" value="spécifier le nombre des lignes à obtenir de la base de données (grand nombre prend plus du temps)" showEffect="clip" hideEffect="clip"/>
</p:panel>
<p:panel styleClass="userPanel" header="Données utilisateur">
<p:panelGrid styleClass="userPanelContent" columns="1">
<p:commandButton id="userbtn" value="Utilisateur" style="width: 100px!important;"/>
<p:commandButton id="colsshow" value="Colonnes" style="width: 100px!important;"/>
</p:panelGrid>
</p:panel>
<p:growl id="msg" showDetail="true"/>
</p:panelGrid>
</p:layoutUnit>
<br></br>
<p:layoutUnit id="cent"
position="center"
resizable="true"
collapsible="true"
effect="drop"
size="300"
styleClass="heighter">
....... all tags closed respectfully.
and thank you all.
Set appendToBody="true" on p:dialog when using with p:layout.

Resources