After upgraded PrimeFaces from 7 to 8 schedule is not viewing events on it. Before update, it was working fine.
Schedule panel in xhtml file;
<p:panel style="margin-right: 3px;margin-bottom: 3px"
rendered="#{dashboardBean.renderedAjandam}" closable="true"
toggleable="true" id="ajandam" header="Ajandam" resize="true"
autosize="true" scrollable="true">
<h:form>
<p:scrollPanel mode="native" style="border: hidden;height:375px"
columnClasses="value">
<p:schedule id="schedule" value="#{hatirlaticiBean.eventModel}"
locale="tr" timeZone="GMT+3">
<p:ajax event="dateSelect"
listener="#{hatirlaticiBean.onDateSelect}"
update=":frmeventDialog:eventDetails"
oncomplete="PF('eventDialog').show();" />
<p:ajax event="eventSelect"
listener="#{hatirlaticiBean.onEventSelect}"
update=":frmeventDialog:eventDetails"
oncomplete="PF('eventDialog').show();" />
<p:ajax event="eventMove"
listener="#{hatirlaticiBean.onEventMove}"
update=":frmLytCenter:messages" />
<p:ajax event="eventResize"
listener="#{hatirlaticiBean.onEventResize}"
update=":frmLytCenter:messages" />
</p:schedule>
</p:scrollPanel>
</h:form>
<p:ajax event="close" listener="#{dashboardBean.onClose}"
update=":frmLytCenter,messages" />
</p:panel>
Related
I want to do conditional Polling in Primefaces (Version:6.0.0).
Here is the polling code:
<p:poll interval="20" update="liveChart,chrtTC_Cnt_Status,chrtStatus" />
For Example, I am field call Status. If status value is 'In-Progress' then only polling should start. Or else it should not do polling.
Here is my field code, if this value changed to 'In-Progress' then polling should start or else not
<p:outputLabel value="Status:" />
<p:outputLabel id="lblCurrentStatus" value="#{backingBean.status}" />
Here is my Xhtml code
<h:panelGrid columns="2" width="400">
<p:outputLabel for="lblStudentName" value="Select Other StudentName: " />
<p:selectOneMenu id="lblStudentName" style="width:250px"
value="#{backingBean.selectedStudent}"
panelStyle="width:180px" effect="fade" filter="true"
filterMatchMode="startsWith">
<f:selectItem itemLabel="Select One" itemValue=""
noSelectionOption="true" />
<f:selectItems value="#{backingBean.studentItemList}" />
<p:ajax
listener="#{backingBean.OnChangeOtherStudentDropDown}"
update=":idForm:tabStatus:p1,:idForm:tabStatus:p4,growl"
process="#form" />
</p:selectOneMenu>
<p:tabView id="tabStatus">
<p:tab title="Status" id="idStatusTab">
<h:panelGrid columns="3" cellpadding="10" id="p1">
<p:growl id="growl" showDetail="true" />
<p:ajaxStatus onstart="PF('statusDialog').show()"
onsuccess="PF('statusDialog').hide()" />
<p:dialog widgetVar="statusDialog" draggable="false"
closable="false" resizable="false" showHeader="false">
<h:graphicImage value="/images/ajax-loader.gif" />
</p:dialog>
<h:panelGrid columns="2" cellpadding="5" id="p2">
<p:outputLabel value="Failed:" />
<p:outputLabel id="lblCurrentFailed"
value="#{backingBean.intCurrentFailedStudent}" />
<p:outputLabel value="Processed:" />
<p:outputLabel id="lblCurrentProcess"
value="#{backingBean.intCurrentPassedStudent}" />
<p:outputLabel value="Status:" />
<p:outputLabel id="lblCurrentStatus"
value="#{backingBean.status}" />
</h:panelGrid>
<h:panelGrid columns="2" cellpadding="10" id="p3">
<p:chart type="pie" model="#{backingBean.pieModel1}"
rendered="#{not empty backingBean.pieModel1}"
id="chrtStatus" style="width:300px;height:200px">
</p:chart>
<br />
</h:panelGrid>
</h:panelGrid>
<h:panelGrid columns="3" cellpadding="10" id="p4">
<p:poll interval="20" update="liveChart,chrtTC_Cnt_Status,chrtStatus" />
<p:chart type="line"
model="#{backingBean.lineCurrentLineChart}"
rendered="#{not empty backingBean.lineCurrentLineChart}"
id="liveChart" style="height:500px;width:500px" />
<p:chart type="bar"
model="#{backingBean.barStatusCountStudent}"
rendered="#{not empty backingBean.barStatusCountStudent}"
id="chrtTC_Cnt_Status" style="width:500px;height:500px">
<p:ajax event="itemSelect" listener="#{backingBean.itemSelect}" />
</p:chart>
</h:panelGrid>
</p:tab>
</p:tabView>
</h:form>
Solution 1:
Wrap your p:poll within h:panelGroup or h:panelGrid, set rendered="#{backingBean.status eq 'In-Progress'}" on panel and update panel on changing of status, that will reset your polling.
Solution 2:
If you want to manually start and stop the polling then you need to set autoStart="false" and add widgetVar="statusPoll" attributes on p:poll and by invoking PF('statusPoll').start(); and PF('statusPoll').stop(); on changing the value of status field.
It is working,
<h:panelGrid columns="1" id="ID_polling" rendered="#{BackingBean.status eq 'In-Progress'}">
<p:poll interval="20" update="liveChart,chrtTC_Cnt_Status,chrtStatus" />
</h:panelGrid>
When I write this Panel, Panel will display only when status = 'In-Progress' or else it will not display.
Thank you again,
I get the following Error on creating an composite component from primefaces dataTable. What am I doing wrong !?
Exception
javax.faces.view.facelets.TagException: /view/restrito/basico/municipio.xhtml #77,165 <p:ajax> Composite component does not support event rowSelect
tabela-padrao.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:cc="http://xmlns.jcp.org/jsf/composite"
xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://xmlns.jcp.org/jsf/core"
xmlns:h="http://xmlns.jcp.org/jsf/html">
<!-- INTERFACE -->
<cc:interface>
<cc:attribute name="uniqueId" required="true" />
<cc:attribute name="value" required="true" />
<cc:attribute name="var" required="true" />
<cc:attribute name="selection" required="true" />
<cc:attribute name="exportedFileName" required="true" />
<cc:attribute name="renderedTable" default="true"/>
<cc:attribute name="primaryKey" required="true"/>
</cc:interface>
<!-- IMPLEMENTATION -->
<cc:implementation>
<p:dataTable value="#{cc.attrs.value}"
id="#{cc.attrs.uniqueId}"
scrollable="true"
scrollWidth="100%"
var="#{cc.attrs.var}"
rendered="#{cc.attrs.renderedTable}"
selection="#{cc.attrs.selection}"
rowKey="#{cc.attrs.primaryKey}"
selectionMode="single"
paginator="true"
rowsPerPageTemplate="15,30,45"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown} {Exporters}"
emptyMessage="#{bundle.tabela_nenhum_registro_encontrado}">
<cc:insertChildren/>
<f:facet name="{Exporters}">
<h:commandLink style="padding: 5px 5px 5px 5px ;" title="Converter para Excel" >
<h:outputText styleClass="fa fa-file-excel-o Fs20"/>
<p:dataExporter type="xls" target="#{cc.attrs.uniqueId}" fileName="#{cc.attrs.exportedFileName}" />
</h:commandLink>
<h:commandLink style="padding: 5px 5px 5px 5px ;" title="Converter para PDF" >
<h:outputText styleClass="fa fa-file-pdf-o Fs20"/>
<p:dataExporter type="pdf" target="#{cc.attrs.uniqueId}" fileName="#{cc.attrs.exportedFileName}"/>
</h:commandLink>
</f:facet>
</p:dataTable>
</cc:implementation>
Using the Composite Component / Usando o componente
<h:form id="tabela-municipio">
<ezcomp:tabela-padrao value="#{municipioMB.listaMunicipios}"
uniqueId="id-tabela-municipio"
var="mun"
primaryKey="#{mun.id}"
selection="#{municipioMB.municipio}"
exportedFileName="municipios">
<p:ajax event="rowSelect" listener="#{municipioMB.onRowSelect}" update="#(form[id*='frm-municipio']),#(form[id*='tabela-municipio'])" />
<p:ajax event="rowUnselect" listener="#{municipioMB.onRowUnselect}" update="#(form[id*='frm-municipio']),#(form[id*='tabela-municipio'])" />
<p:column headerText="Pais" width="300" filterBy="#{mun.estado.pais.nome}" filterMatchMode="contains">
<h:outputText value="#{mun.estado.pais.nome}"/>
</p:column>
<p:column headerText="Estado" width="300" filterBy="#{mun.estado.sigla} - #{mun.estado.nome}" filterMatchMode="contains">
<h:outputText value="#{mun.estado.sigla} - #{mun.estado.nome}"/>
</p:column>
<p:column headerText="Município" filterBy="#{mun.nome}" filterMatchMode="contains">
<h:outputText value="#{mun.nome}"/>
</p:column>
</ezcomp:tabela-padrao>
</h:form>
You have to create and register the custom events in your composite component and pass the corresponding actions to datatable. As rowSelect and rowUnselect events are register on datatable not a composite component. Use clientBehavior to register the events for composite component.
<cc:interface>
...
<cc:clientBehavior name="customRowSelectEvent" targets="idOfDataTable" event="rowSelect" />
<cc:clientBehavior name="customRowUnselectEvent" targets="idOfDataTable" event="rowUnselect" />
</cc:interface>
name is name of the custom event.
targets is the id of component for which you want to actually register the action. In your case id of datatable.
event is the actual event which you want to register for the datatable.
Now register the events for composite components.
<ezcomp:tabela-padrao ....>
<f:ajax event="customRowSelectEvent" listener="#{municipioMB.onRowSelect}" update="#(form[id*='frm-municipio']),#(form[id*='tabela-municipio'])" />
<f:ajax event="customRowUnselectEvent" listener="#{municipioMB.onRowUnselect}" update="#(form[id*='frm-municipio']),#(form[id*='tabela-municipio'])" />
.....
</ezcomp:tabela-padrao>
As you can see i first look for a person with a first commandButton, then i select a person in the datatable and i have a second commandButton, and i'd like to switch the defaultCommand on button2 after i selected a person, how can i achieve this?
<h:form id="form"
rendered="#{security.asRole('ADMIN') or security.asRole('GESTIONNAIRE')}">
<f:event type="preRenderView" listener="#{paieAgentView.init()}" />
<p:fieldset legend="Recherche de l'agent">
<p:panelGrid columns="2">
<p:panelGrid columns="2" id="pgRechercheAgent">
<h:outputLabel value="Matricule :" />
<p:inputText id="matricule"
value="#{paieAgentView.agentSearched.matricule}">
<p:ajax process="matricule" partialSubmit="true" event="keyup" />
<h:commandButton id="boutonLigneAgent"
action="#{paieAgentView.searchLigneAgent()}"
value="Rechercher les agents" icon="ui-icon-search"
update="listAgents" immediate="true" >
<f:ajax render="#form" execute="#this" />
</h:commandButton>
<br />
</p:panelGrid>
<p:dataTable id="listAgents" var="agt"
value="#{paieAgentView.listLigneAgent}"
selection="#{paieAgentView.agentSelected}"
rowKey="#{agt.matricule}" style="margin-bottom:0"
selectionMode="single" scrollRows="20" scrollable="true"
liveScroll="true" scrollHeight="250">
<p:ajax event="rowSelect" update=":form:pgRechercheContrats" />
<p:column headerText="Matricule">
<h:outputText value="#{agt.matricule}" />
</p:column>
<p:column headerText="Nom">
<h:outputText value="#{agt.nomPat} #{agt.prenom}" />
</p:column>
</p:dataTable>
</p:panelGrid>
<p:defaultCommand target="boutonLigneAgent" />
</p:fieldset>
<p:fieldset legend="Critères de recherche">
<p:panelGrid columns="3" id="pgRechercheContrats">
<h:panelGrid columns="1" style="margin-bottom:10px" cellpadding="5">
<p:outputLabel for="typePeriode" value="Période de paie:" />
<p:selectOneRadio id="typePeriode"
value="#{paieAgentView.typePeriode}">
<f:selectItem itemLabel="Période de paie" itemValue="paie" />
<f:selectItem itemLabel="Période d'origine" itemValue="origine" />
</p:selectOneRadio>
</h:panelGrid>
<h:panelGrid columns="2" id="pgCalendar">
<h:outputLabel value="Date Debut : " for="calendrierDateDebut" />
<p:calendar id="calendrierDateDebut"
value="#{paieAgentView.dateDebut}" pattern="yyyy-MM-dd"
effect="slideDown" navigator="true" mode="inline"
locale="#{sessionControleur.langue}" style="moisAnSeul" />
<h:outputLabel value="Date fin : "
for="calendrierDateFin" />
<p:calendar id="calendrierDateFin"
value="#{paieAgentView.dateFin}" pattern="yyyy-MM-dd"
effect="slideDown" navigator="true" mode="inline" lang="fr"
locale="fr" style="moisAnSeul" />
</h:panelGrid>
<p:selectManyCheckbox id="gridTypesPaie"
value="#{paieAgentView.selectedTypesPaie}" columns="1"
layout="pageDirection">
<f:selectItems value="#{paieAgentView.typesPaie}" var="type"
itemLabel="#{type.label}" itemValue="#{type.value}" />
</p:selectManyCheckbox>
</p:panelGrid>
</p:fieldset>
<p:commandButton process="pgRechercheContrats"
icon="ui-icon-file-pdf" value="Editer les fiches de paie"
action="#{paieAgentView.printPaieAgent()}" update="#form"
escape="false" ajax="false"
onclick="regenererCal();this.form.target='_blank'" />
</h:form>
Make 2 defaultCommands both with rendered attribute. Rendered should check if person is selected or not and action called must be appropriete on that. since you are updating whole form every time something change this should work
<p:defaultCommand target="boutonLigneAgent" rendered="#{personIsSelected()}"/>
<p:defaultCommand target="pgRechercheContrats" rendered="#{personIsNotSelected()}"/>
I have a p:dataTable looks like this.
<p:remoteCommand name="rowEdit" action="#{servicesController.onRowEditCommand}" update="servicesTable" />
<p:remoteCommand name="rowEditCancel" action="#{servicesController.onRowEditCancelCommand}" update="servicesTable" />
<p:dataTable id="servicesTable"
value="#{servicesController.services}" var="service" rowKey="#{service.id}"
editable="true" editMode="row">
<p:ajax event="rowEdit" listener="#{servicesController.onRowEdit}"
oncomplete="rowEditCommand()"/>
<p:ajax event="rowEditCancel" listener="#{servicesController.onRowEditCancel}"
oncomplete="rowEditCancelCommand()"/>
<p:ajax event="rowSelect" update=":mainMenu"
listener="#{servicesController.sessionScopeServiceChanged}"/>
<!-- other columns here -->
<p:column style="width: 44px;">
<p:rowEditor/>
</p:column>
<!-- other columns here -->
</p:dataTable>
The p:rowEditor works fine for the first time. And it doesn't work from the second time. It gets to edit mode but the checkbox and x doesn't respond.
Two command names were wrong.
<p:remoteCommand name="rowEdit" ... />
<p:remoteCommand name="rowEditCancel" ... />
<p:ajax ... oncomplete="rowEditCommand()"/>
<p:ajax ... oncomplete="rowEditCancelCommand()"/>
I changed to.
<p:remoteCommand name="rowEditCommand" ... />
<p:remoteCommand name="rowEditCancelCommand" ... />
<p:ajax ... oncomplete="rowEditCommand()"/>
<p:ajax ... oncomplete="rowEditCancelCommand()"/>
I have simple flow of 3 tabs. I have tested the Simple tabview example on showcase.
But When I change the first tab with my content, I can't switch to other tabs.
Kindly guide me with what is wrong that needs to be changed.
Earlier I was using Wizard but I had the same tab change problem there as clicking on next was taking me to the last tab everytime.
and Now facing other issue with Tabview
I am posting the code:
<h:form id="compositionmaster">
<p:tabView id="tabView">
<p:tab id="tab1" title="Committee Details">
<h:panelGrid columns="2" columnClasses="label, value">
<h:outputText value="Committee Type: " />
<p:selectOneMenu id="type" value="#{userWizard.comm.committeeType}" effect="fade">
<f:selectItem itemLabel="----Select----" itemValue="0" />
<f:selectItem itemLabel="New" itemValue="1" />
<f:selectItem itemLabel="Existing" itemValue="2" />
</p:selectOneMenu>
<h:outputText value="Concerned Division: " />
<p:selectOneMenu id="division" value="#{userWizard.comm.committeeSubType}" effect="fade">
<f:selectItem itemLabel="----Select----" itemValue="0" />
<f:selectItem itemLabel="Administration" itemValue="1"/>
<f:selectItem itemLabel="Finance" itemValue="2" />
<f:selectItem itemLabel="Marketing" itemValue="3" />
<f:selectItem itemLabel="Others" itemValue="4" />
</p:selectOneMenu>
<h:outputText value="Committee Name: " />
<p:inputText value="#{userWizard.comm.committeeName}" maxlength="100"/>
<h:outputText value="Subject: " />
<p:inputText value="#{userWizard.comm.committeeSubject}" maxlength="100" />
<h:outputText value="Description: " />
<p:inputText value="#{userWizard.comm.committeeDescription}" maxlength="500" />
<h:outputText value="Tenure of Committee: " />
<p:panelGrid columns="2" >
<p:inplace id="Tenure" label="From">
<p:calendar value="#{userWizard.comm.startDate}" id="start" showOn="button" />
</p:inplace>
<p:inplace label="To">
<p:calendar value="#{userWizard.comm.endDate}" id="end" showOn="button" />
</p:inplace>
</p:panelGrid>
<h:outputText value="Add Document: " />
<h:form enctype="multipart/form-data">
<p:fileUpload fileUploadListener="#{fileBean.handleFileUpload}" mode="advanced" update="messages" multiple="true" sizeLimit="100000" allowTypes="/(\.|\/)(gif|jpe?g|png|doc|pdf)$/"/>
</h:form>
</h:panelGrid>
</p:tab>
<p:tab id="tab2" title="Godfather Part II">
<h:panelGrid columns="2" cellpadding="10">
<h:outputText id="tab2Text" value="stature grows."/>
</h:panelGrid>
</p:tab>
<p:tab id="tab3" title="Godfather Part III">
<h:panelGrid columns="2" cellpadding="10">
<h:outputText id="tab3Text" value="After a promise that his family would one day be completely legitimate."/>
</h:panelGrid>
</p:tab>
</p:tabView>
</h:form>
Don't use nested forms
HTML doesn't allow nested forms, so you shouldn't use them in primefaces either.They can cause undesired behavior.
See: other stackoverflow questions, or a nice collection of things to avoid in JSF: here (note point 2)
This is the only problem I see in your code. Other than that in rare cases you might have problems if using ajax and not processing the whole form. But as I can see this is not the case in your code.