i updated Primefaces version 5.1 to 5.2
After that all my DataTables with following structure are no longer working.
<p:dataTable value="#{device.lazyDataModelHosts}" var="host"
style="font-size: larger;"
rowIndexVar="rowNr"
rendered="#{not empty device.managedServiceList}"
scrollRows="50"
lazy="true"
liveScroll="true"
scrollable="true"
scrollHeight="150"
selectionMode="single"
emptyMessage="#{device.emptyMessage}"
id="tbl"
resizableColumns="true"
styleClass="auto-resize"
>
...
</p:dataTable>
Any suggestions?
Thx, flo
Related
I'm using a p:datatable with filters and pagination. Both work fine individually, but if I filter first then move to the second page of results, the filter is removed and I'm seeing the second page of the original data set. Here's what my table looks like :
<p:dataTable value="#{bean.products}" var="product"
paginator="true" paginatorPosition="bottom" rows="5"
filteredValue="#{bean.filteredProducts}"
rowKey="#{product.prdctId}">
<p:ajax event="sort" skipChildren="false" />
<p:column headerText="Description" filterBy="#{product.description}" filterMatchMode="contains"
sortBy="#{product.prdctId}">
<h:outputText value="#{product.description}" />
</p:column>
(other columns)
</p:dataTable>
Any ideas?
Using Primefaces 5.2, JSF 2.0.3
Edit : After searching a bit more, I found another post dealing with the same issue, but it was never answered.
<p:dataTable value="#{bean.products}" var="product"
paginator="true" paginatorPosition="bottom" rows="5"
filteredValue="#{bean.filteredProducts}"
rowKey="#{product.prdctId}">
<p:ajax event="sort" skipChildren="false" />
<p:column headerText="Description" filterBy="#{product.description}" filterMatchMode="contains"
sortBy="#{product.prdctId}">
<h:outputText value="#{product.description}" />
</p:column>
(other columns)
Add in your datatable: widgetVar="productTable"
in your button add this: oncomplete="PF('productTable').clearFilters();"
This questions screams to be a duplicate of JSF 2.0 + Primefaces 2.x: Tooltip for datatable row but since this old question has NO working/satisfying solution for me and there's no way (?) to get attention back to it I opened this new one.
It's very simple:
I have a dataTable (with JSF-standard or with primefaces) and I'd like to add a different tooltip for EACH row (not just for one field in it!).
What I tried so far:
<pe:tooltip value="This is row number #{rowIndex}"
for="#(#table1 tr[role=row][data-ri=#{rowIndex}])"
atPosition="top center" myPosition="bottom center"
shared="true" />
where #table1is the ID of my data table . This came to my mind because of this.
And both solutions from JSF 2.0 + Primefaces 2.x: Tooltip for datatable row : the first solutions works, but only for ONE field / id and not for the whole row. The second solution won't work at all for me.
And I'm 100% sure that both - primefaces & primefaces extensions - are working for me, I tested it.
I've done some test and this approach works perfectly:
<p:dataTable var="entry" value="#{....}" styleClass="myTable" rowIndex="rowIndex">
<p:column headerText="Header 1">
<h:outputText value="#{entry.value1}" />
</p:column>
<p:column headerText="Header 2">
<h:outputText value="#{entry.value2}" />
<pe:tooltip value="This is row number #{rowIndex}" forSelector=".myTable tr[role=row][data-ri=#{rowIndex}]"
shared="true" atPosition="top center" myPosition="bottom center" showDelay="500" />
</p:column>
</p:dataTable>
Note that in order to the data-ri attribute to be placed on datatable rows, you need the to add the attribute rowIndex (rowIndex="rowIndex").
It also worked with
<p:tooltip for="#(.myTable tr[role=row][data-ri=#{rowIndex}])" value="This is row number #{rowIndex}" />
You can also do it without using primefaces extensions. This example code works for me with primefaces 5.2.
Be aware that in primefaces 5.2 the p:dataTable attibute is rowIndexVar and not rowIndex as in the example above.
<h:form id="idform">
<p:dataTable var="komp"
id="idDataTable"
value="#{kompselect.listKomponenten}"
rowIndexVar="rowIndex"
selection="#{kompselect.selectedKomponente}"
rowKey="#{komp.name}">
<p:column>
<h:outputText id="otSelKomponente" value="#{komp.name}" />
<p:tooltip rendered="#{komp.displayToolTip}"
for="idForm:iddataTable:#{rowIndex}:otSelKomponente"
value="this is my Tooltip"/>
</p:column>
</p:dataTable>
according to this commment https://stackoverflow.com/a/13327334/4851983 (thaks BalusC )
Let primefaces link the objects automatically. I could show a tooltip for a textArea Primefaces 3.5 , as is show below
<p:dataTable id="commentsTable"
value="#{historyReq.commentsFromReq}" var="comment"
emptyMessage="#{localeMsg.roles_table_empty}"
rows="10"
styleClass="myTable"
rowIndexVar="rowIndex">
<p:column headerText="HEADER A">
<h:outputText value="#{bean.valorA}" />
</p:column>
<p:column headerText="#{HEADER B}">
<p:inputTextarea id="txtArea" cols="45" rows="1"
value="#{bean.valorB}"
readonly="true"
disabled="false"
autoResize="false">
<f:converter converterId="commentsConverter" />
</p:inputTextarea>
<p:tooltip for="txtArea" value="This is row number #{rowIndex}" />
</p:column>
I am trying to update a table by using RequestContext.update()
The following code is working (jsf):
<h:panelGrid columns="2" style="width: 100%" columnClasses="treeColumn,tableColumn">
<h:panelGroup id="treePanel">
<p:tree id="tree"
value="#{bean.root}"
var="node"
dynamic="true"
cache="true"
animate="true"
selectionMode="single"
selection="#{bean.selectedNode}"
rendered="#{bean.renderTree}">
<p:ajax event="select" listener="#{bean.onNodeSelect}" update=":mainForm:treePanel,:mainForm:tablePanel"/>
<p:ajax event="collapse" listener="#{bean.onNodeCollapse}"/>
<p:treeNode expandedIcon="ui-icon-folder-open"
collapsedIcon="ui-icon-folder-collapsed">
<h:outputText value="#{node.name}" styleClass="tableTreeText"/>
</p:treeNode>
<p:treeNode expandedIcon="ui-icon-folder-open"
collapsedIcon="ui-icon-folder-collapsed">
<h:outputText value="#{node.name}" styleClass="tableTreeText"/>
</p:treeNode>
</p:tree>
</h:panelGroup>
<h:panelGroup id="tablePanel" styleClass="acqPanelTable">
<p:dataTable id="acqDataTable"
widgetVar="acqTablehdsWidget"
var="acq"
value="#{bean.list}"
rendered="#{bean.renderTable}"
filteredValue="#{bean.filteredList}"
paginator="true"
paginatorPosition="bottom"
.....
....
...
..
.
But not via the server side:
RequestContext requestContext = RequestContext.getCurrentInstance();
requestContext.update(":mainForm:tablePanel");
renderTable = true;
I don’t understand what is the different ?
Appreciate your help for any advice
Thanks
Remove the leading colon.
requestContext.update("mainForm:tablePanel");
It's always resolved relative to UIViewRoot. The leading colon is only valid when you're currently sitting in an UINamingContainer component in the view.
From PrimeFaces 7.0 and after the class RequestContext have been replaced by the class PrimeFaces as indicated in the migration guide. Hence, in order to update a component you may call:
PrimeFaces.Ajax currentAjax = PrimeFaces.current().ajax();
currentAjax.update("myFormId:myDatatableId");
Try using:
FacesContext.getCurrentInstance().getPartialViewContext().getRenderIds().add("formName:objectId");
It works in primefaces 4.0
RequestContext req = RequestContext.getCurrentInstance();
req.update("YourUIBlock");
I am using primefaces 3.4.2 datatable with in-cell editing. I would like after the edit event method is called, the datatable itself to be updated. I did it like this:
<p:dataTable id="timeTable" var="log" value="#{reviewTimesheetBean.lazyModel}" paginator="true"
paginatorTemplate="{FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" rowsPerPageTemplate="15,30,45,60"
paginatorPosition="bottom" rows="2" currentPageReportTemplate="{currentPage} de {totalPages}" lazy="true" editable="true" emptyMessage="#{label['empty.message']}">
<p:ajax event="rowEdit" listener="#{reviewTimesheetBean.onEdit}" update="timeTable" />
<p:ajax event="rowEditCancel" listener="#{reviewTimesheetBean.onCancel}" update="timeTable" />
....
</p:datatable>
But the load method is never called after the rowEdit event. I also tried using the selectors, but it did not work either. Can't the datatable be updated this way?
Thanks
Kelly
Have you tried remoteCommand?
<p:remoteCommand name="onCellEdit" action="#{bean.init}" update="formId" ignoreAutoUpdate="true" />
And then in your datatable:
<p:ajax event="cellEdit" oncomplete="onCellEdit()" listener="#{bean.onCellEdit}" />
PS. the remoteCommand is just above the datatable... not sure if that has any impact.
Note the onComplete value must match the name of the remote command.
JSF Datatable
<ui:repeat var="folioVO" value="#{myBean.folioList}" id="folioTable">
<h:dataTable id="promotion_dataTable" var="articlePromo"
value="#{folioVO.lstArticles}" >
...<
</h:dataTable>
</ui:repeat>
In this case, the datatable id which gets generated is : folioTable:ui repeat number:promotion_dataTable
Primefaces datatable:
<ui:repeat var="folioVO" value="#{myBean.folioList}" id="folioTable">
<p:dataTable id="promotionDetail_dataTable" var="articlePromo"
value="#{folioVO.lstArticles}" >
...
</p:dataTable>
</ui:repeat>
In this case, the datatable id which gets generated is : folioTable:promotion_dataTable
Since the repeat id ìs not getting appended in case of primefaces datatable, All the jquery /javascript gets applied to the first table.
How can this be done ..?
Thanks
The following worked:
<p:dataList var="folioVO" value="#{myBean.folioList}" id="folioTable">
<p:column>
<p:dataTable id="promotionDetail_dataTable" var="articlePromo"
value="#{folioVO.lstArticles}" >
...
</p:dataTable>
</p:column>
</p:dataList>