*i would be add the icon in the header of my daTaTable but when i execute the programme the icon not display he's appear {Exporters}. i use jsf 2.2.0 primeFaces 5 eclipce juno
this is my code view :
<p:dataTable id="tbl" var="produit" editable="true" value="#{produitBean.produits}"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks {NextPageLink} {LastPageLink} {Exporters} "
paginator="true" rows="10" style="margin-bottom:20px">
<f:facet name="{Exporters}">
<h:commandLink>
<h:graphicImage library="images" name="excel.png" width="24" />
<p:dataExporter type="xls" target="tbl" fileName="produits" />
</h:commandLink>
What exact version of PrimeFaces are you using? This feature is only available from version 5.0.2:
http://blog.primefaces.org/?p=3194
For example, if you have the 5.0 community version you won't be able to use that.
Related
i have a lazy loaded primefaces 8 datatable as follows:
<p:dataTable value="#{....model}" var="..." rows="20" lazy="true"
paginator="true" paginatorPosition="bottom"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
currentPageReportTemplate="{startRecord}-{endRecord} of {totalRecords} records"
emptyMessage="No records found">
....
</p:dataTable>
and a p:ajaxStatus defined as follows:
<p:ajaxStatus onstart="PF('statusDialog').show()" onsuccess="PF('statusDialog').hide()"/>
<p:dialog widgetVar="statusDialog" modal="false" draggable="false" closable="false" resizable="false"
showHeader="false"
styleClass="app-loader-dialog">
<div id="app-loader" class="app-loader">
<div class="app-loader-content">
loading...
</div>
</div>
</p:dialog>
The issue I noticed is that when paginating, the status dialog opens, but it stays open even after the pagination is complete, at which it is expected to hide.
But for other ajax activities such as dependent dropdown, etc. it shows and hides appropriately.
How can i resolve this?
I wrapped the dataTable in a h:form, and its working now.
How to unselected a selected row on a dataTable primefaces using only a click, the same way that it work to select the row.
This is the code I am using to select and unselect at the moment, but the unselect needs to press the Ctrl or CMD (on mac) key.
<p:dataTable
value="#{adminiClubReconManager.bankMovementsFound}" var="movs"
style="width:90%;border: 0px;"
selection="#{adminiClubReconManager.selectedBankMovement}"
rowKey="#{movs.id}" editable="true" styleClass="rowStyle"
paginator="true" rowsPerPageTemplate="5,10,15" rows="10"
selectionMode="mutiple"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">
<p:ajax event="rowSelect"
listener="#{adminiClubReconManager.onBankRowSelect()}"
update="#form:reconMessages" />
<p:ajax event="rowUnselect"
listener="#{adminiClubReconManager.onBankRowUnselect()}"
update="#form:reconMessages" />
<p:column
style="background:transparent;border:0px;text-align:left">
<c:facet name="header">
<h:outputText
value="#{msg['admini.common.movement.recon.number']}" />
</c:facet>
<h:outputText value="#{movs.id}"
style="background:transparent;border:0px" />
</p:column>
...
</p:dataTable>
We've 2 possibilities for solve this issue.
First
Create commandButton and call primefaces method unselectAllRows();
<p:dataTable id="dataTableId" var="p" value="#{myBean.dataModel}" paginator="true" rows="50" paginatorPosition="bottom" emptyMessage="Empty results" rowKey="#{p.attribute}" selection="#{myBean.atributeList}" widgetVar="dataTableWidgetVar">`
<p:commandButton widgetVar="buttonClear" value="Clear selection" onclick="dataTableWidgetVar.unselectAllRows();"/>
</p:dataTable>
After the click you have the rows deselected
Second
Via ajaxEvent call primefaces method unselectAllRows();
<p:dataTable id="dataTableId" var="p" value="#{myBean.dataModel}" paginator="true" rows="50" paginatorPosition="bottom" emptyMessage="Empty results" rowKey="#{p.attribute}" selection="#{myBean.atributeList}" widgetVar="dataTableWidgetVar">`
<p:ajax event="page" update="dataTableId" oncomplete="dataTableWidgetVar.unselectAllRows();"/>
...
</p:dataTable>
In this case you selected the data of the first page when you click another page for example page 3, the ajax execute the method
UnselectAllRows (); And you clear you have selected.
For solve this i finded this material at primefaces forum in: https://forum.primefaces.org/viewtopic.php?f=3&t=24144
I had a perfectly working accordion with forms and datatables, until I decided to hide some tabs according to a get param. For example /editarContrato.jsf?id=19
Now the rendered tabs appear but empty. I now the boolen is correctly evaluated, and that the tab header is showing when it should, but not the content.
Thanks!
<p:accordionPanel multiple="true" dynamic="true" cache="false"
id="mainAccordion">
<p:tab title="#{msg['label.contrato']}" id="mainTab">
<h:form styleClass="form-horizontal" id="form">
</h:form>
</p:tab>
<p:tab title="Plan de Pagos" rendered="#{not empty param.id}">
<h:form styleClass="form-horizontal" id="formPago">
<p:dataTable id="dataPagos" value="#{pagoMB.dataPagos}" var="pago"
editable="true" ajax="true" royKey="#{pago.id}" scrollable="true"
scrollWidth="100%" rows="10" paginator="true"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15" style="table-layout: auto">
<f:facet name="header">Plan de Pagos
</f:facet>
</p:dataTable>
</h:form>
</p:tab>
Try:
<p:tab title="Plan de Pagos" rendered="#{not empty param['id']}">
Param is a map of values and id can't be resolved this way.
Simply I have composite component of datatable using primefaces 4.0 the rendered output had no sorting facility nor filtering (i.e. column header has no arrows for sort and there is no input for filter field); my code as below
<composite:implementation> <p:dataTable value="#{cc.attrs.objectList}" var="item" resizableColumns="true" draggableColumns="true" paginator="true"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" rows="10"
rowsPerPageTemplate="5,10,15" scrollable="true" scrollHeight="150" editable="true" editMode="cell" lazy="true" >
<c:if test="#{!empty cc.attrs.column1Value }">
<p:column sortBy="#{item[cc.attrs.column1Value]}" filterBy="#{item[cc.attrs.column1Value]}" headerText="#{cc.attrs.column1Label}" rendered="#{empty cc.attrs.column1InputList}">
#{item[cc.attrs.column1Value]}
</p:column>
</c:if>
I tried to change the value of sort by to be sortBy=#{cc.attrs.colum1Value} the sorting arrows appears but it doesn't work ... I'm using Jboss 6.1 Final GA, primefaces 4.0, Mojarra-2.0, jsf-impl-2.0.3-b05.jar. I appreciate your support to get sorting and filtering work inside composite component
I use primefaces to display a list in a datatable with pagination.
The layout for the Page DropDown is not correct.
Screenshot:
How can I set this layout?
It now stretches along the whole width of the table. This is not good.
<p:dataTable id="dataTable" value="#{bean.lazyModel}" var="item"
paginator="true"
rows="10"
paginatorTemplate="{CurrentPageReport} {FirstPageLink}
{PreviousPageLink} {PageLinks} {NextPageLink}
{LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15,50,100"
lazy="true"
selectionMode="single"
selection="#{orderEntrySearchBacking.selected}"
rowKey="#{item.id}">
<f:facet name="header">
Patients
<p:commandButton id="toggler" type="button" value="Columns"
style="float:right" icon="ui-icon-calculator" />
<p:columnToggler datasource="dataTable" trigger="toggler" />
</f:facet>
<p:column>
<h:outputText value="#{item.name}"/>
</p:column>
<p:column>
<h:outputText value="#{item.date}"/>
</p:column>
....
This problem is related to the {RowsPerPageDropdown}, but I can't get the style correct. Help is appreciated.
That's all folks!
It looks like your <select> element has style width: 100%.
Inspect dropdown and find where style rule come from.
To fix it you should override this rule. One of the ways is to add following style rule to your .css file.
select.ui-paginator-rpp-options{
width:auto;
}