Datatable filtering in rowexpansion spread on all parent table rows

[malaussene]

Hi all,

I have a parent datatable that for each row has a child datatable accessible throw rowexpansion.
When I apply filters to the child table the filtered list is inherited by all the other child tables.
Same behaviour with sorting functionalities.

this is the code block:

Code: Select all

					<p:dataTable id="tableData1" var="app" value="#{licenseMonitoringService.dataList}" widgetVar="applicationsDataTable"
						currentPageReportTemplate="Showing {startRecord}-{endRecord} out of {totalRecords}"
						paginator="true" rows="10" paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
						rowsPerPageTemplate="5,10,15">
						<f:facet name="header">
							<p:outputPanel>
								<h:outputText value="Applicazioni" />
							</p:outputPanel>
						</f:facet>
						<p:column style="width:16px">
							<p:rowToggler/>
						</p:column>
						<p:column headerText="ID" filterBy="#{app.applicationId}" filterMatchMode="exact" style="width:75px" filterStyle="width:75%">
							<h:outputText value="#{app.applicationId}" />
						</p:column>
						<p:rowExpansion>
							<p:dataTable id="subTab" var="appLib" value="#{app.libraryCollection}" widgetVar="subDataTable" style="width:100%">
								<f:facet name="header">
									<p:outputPanel>
										<h:outputText value="Librerie contenute nell'applicazione" />
									</p:outputPanel>
								</f:facet>
								<p:column headerText="ID libreria" style="width:75px">
									<h:outputText value="#{appLib.libraryId}" />
								</p:column>
								<p:column headerText="Nome libreria" filterBy="#{appLib.libraryName}" filterMatchMode="contains"  filterStyle="width:75%">
									<h:outputText value="#{appLib.libraryName}" />
								</p:column>
								<p:column headerText="Versione libreria" style="width:150px;text-align:center" filterBy="#{appLib.libraryVersion}" filterMatchMode="contains"  filterStyle="width:75%">
									<h:outputText value="#{appLib.libraryVersion}" />
								</p:column>
								<p:column headerText="Policy Licenza" exportable="false" style="width:200px;;text-align:center"  filterBy="#{appLib.licenseCollection[0].severityPolicy}" filterMatchMode="exact">
									<f:facet name="filter">
										<p:selectOneButton onchange="PF('subDataTable').filter()"> 
											<f:selectItem itemLabel="*" itemValue="" />
											<f:selectItem itemLabel="0" itemValue="0" />
											<f:selectItem itemLabel="1" itemValue="1" />
											<f:selectItem itemLabel="2" itemValue="2" />
											<f:selectItem itemLabel="3" itemValue="3" /> 
										</p:selectOneButton>
									</f:facet>
									<p:panelGrid columns="2" rendered="#{not empty appLib.licenseCollection}">
										<p:row>
											<p:column style="width:50px" exportable="false">
												<h:graphicImage library="images" name="blu.jpg" rendered="#{appLib.licenseCollection[0].severityPolicy == 0}" />
												<h:graphicImage library="images" name="green.jpg" rendered="#{appLib.licenseCollection[0].severityPolicy == 1}" />
												<h:graphicImage library="images" name="yellow.jpg" rendered="#{appLib.licenseCollection[0].severityPolicy == 2}" />
												<h:graphicImage library="images" name="red.jpg" rendered="#{appLib.licenseCollection[0].severityPolicy == 3}" />
											</p:column>
										</p:row>
									</p:panelGrid>
								</p:column>
								<p:column headerText="Security Issue" style="width:150px;text-align:center" filterBy="#{appLib.securityissueCollection}" filterFunction="#{licenseMonitoringService.filterByWarning}" filterStyle="width:100px" exportable="false">
									<f:facet name="filter">
										<p:selectOneButton onchange="PF('subDataTable').filter()">
											<f:selectItem itemLabel="*" itemValue="" />
											<f:selectItem itemLabel="SI" itemValue="true" />
											<f:selectItem itemLabel="NO" itemValue="false" />
										</p:selectOneButton>
									</f:facet>
									<h:graphicImage library="images" name="warning.png" rendered="#{not empty appLib.securityissueCollection}" />
								</p:column>
								<p:column headerText="Security Issue" style="width:0px;text-align:center" filterBy="#{appLib.securityissueCollection}" filterFunction="#{licenseMonitoringService.filterByWarning}" filterStyle="width:0px" exportable="true" >
										<h:outputText value="TRUE" rendered="#{not empty appLib.securityissueCollection}"/>
								</p:column>
								<p:column headerText="Dettagli" style="width:100px" exportable="false">
									<p:commandButton value="Visualizza" icon="ui-icon-search" oncomplete="PF('licensesDialog').show()" update="form:viewLicenses" action="#{licenseMonitoringService.queryDbForAssociatedLicenses(appLib.libraryId)}" />
								</p:column>
							</p:dataTable>
						</p:rowExpansion>
					</p:dataTable>

[kukeltje]

your widgetvar of the subtables is not unique. Try adding the row index to it... so it s made unique in each iteration

[malaussene]

Hi Ronald,
Can you give me an example of it, please?
I try adding roxIndexVar in the subtable, but it didn't work...
Tnx in advance

[kukeltje]

please post what you tried and let me comment on it. I have (unfortunately for you) no time to start creating examples myself.

[malaussene]

Here I am,

I tried adding the rowIndexVar attribute to the child dataTable:
<p:dataTable id="subTab" var="appLib" value="#{app.libraryCollection}" widgetVar="subDataTable" style="width:100%" rowIndexVar="#{app.applicationId}">

but it didn't work.

Thanks

[kukeltje]

But did you use the index in the widgetVar attribute (widgetVar="subDataTable") to create unique widgetVar values? Something like widgetVar="subDataTable_#{...}"

[malaussene]

Hi Ronald,
thanks for your help.
I tried the you suggested but the result is the same, that is my code:

Code: Select all

					<p:dataTable id="tableData1" var="app" value="#{licenseMonitoringService.dataList}" widgetVar="applicationsDataTable"
						currentPageReportTemplate="Showing {startRecord}-{endRecord} out of {totalRecords}"
						paginator="true" rows="10" paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
						rowsPerPageTemplate="5,10,15">
						<f:facet name="header">
							<p:outputPanel>
								<h:outputText value="Applicazioni" />
							</p:outputPanel>
						</f:facet>
						<p:column style="width:16px">
							<p:rowToggler />
						</p:column>
						<p:column headerText="ID" filterBy="#{app.applicationId}" filterMatchMode="exact" style="width:75px" filterStyle="width:75%">
							<h:outputText value="#{app.applicationId}" />
						</p:column>
						<p:column headerText="Nome applicazione" filterBy="#{app.applicationName}" filterMatchMode="contains" filterStyle="width:50%">
							<h:outputText value="#{app.applicationName}" />
						</p:column>
						<p:rowExpansion>
							<p:dataTable id="subTab" var="appLib" value="#{app.libraryCollection}" widgetVar="subDataTable_#{app.applicationId}" style="width:100%">
								<f:facet name="header">
									<p:outputPanel>
										<h:outputText value="Librerie contenute nell'applicazione" />
									</p:outputPanel>
								</f:facet>
								<p:column headerText="ID libreria" style="width:75px">
									<h:outputText value="#{appLib.libraryId}" />
								</p:column>
								<p:column headerText="Nome libreria" filterBy="#{appLib.libraryName}" filterMatchMode="contains"  filterStyle="width:75%">
									<h:outputText value="#{appLib.libraryName}" />
								</p:column>
								<p:column headerText="Security Issue" style="width:150px;text-align:center" filterBy="#{appLib.securityissueCollection}" filterFunction="#{licenseMonitoringService.filterByWarning}" filterStyle="width:100px" exportable="false">
									<f:facet name="filter">
										<p:selectOneButton onchange="PF('subDataTable_#{app.applicationId}').filter()">
											<f:selectItem itemLabel="*" itemValue="" />
											<f:selectItem itemLabel="SI" itemValue="true" />
											<f:selectItem itemLabel="NO" itemValue="false" />
										</p:selectOneButton>
									</f:facet>
									<h:graphicImage library="images" name="warning.png" rendered="#{not empty appLib.securityissueCollection}" />
								</p:column>
							</p:dataTable>
						</p:rowExpansion>
					</p:dataTable>

[kukeltje]

And you actually see different PF('subDataTable_.....').filter() records in the generated html on the client? (and in the network tab if you press one?)

[malaussene]

That's what I see:

Code: Select all

Request URL:http://localhost:8081/ossmanager/faces/jwb/license-monitor.xhtml
Request Method:POST
Status Code:200 OK
Remote Address:[::1]:8081
Referrer Policy:no-referrer-when-downgrade
Response Headers
view source
Cache-Control:no-cache
Content-Type:text/xml;charset=UTF-8
Date:Tue, 11 Apr 2017 14:23:17 GMT
Server:Apache-Coyote/1.1
Transfer-Encoding:chunked
Request Headers
view source
Accept:application/xml, text/xml, */*; q=0.01
Accept-Encoding:gzip, deflate, br
Accept-Language:it-IT,it;q=0.8,en-US;q=0.6,en;q=0.4
Connection:keep-alive
Content-Length:1482
Content-Type:application/x-www-form-urlencoded; charset=UTF-8
Cookie:JSESSIONID=13E9F5EA59016F690A4EA5B5FCF1F91A
Faces-Request:partial/ajax
Host:localhost:8081
Origin:http://localhost:8081
Referer:http://localhost:8081/ossmanager/faces/jwb/license-monitor.xhtml
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36
X-Requested-With:XMLHttpRequest
Form Data
view source
view URL encoded
javax.faces.partial.ajax:true
javax.faces.source:form:content-form:tableData1
javax.faces.partial.execute:form:content-form:tableData1
javax.faces.partial.render:form:content-form:tableData1
form:content-form:tableData1:form:content-form:tableData1
form:content-form:tableData1_rowExpansion:true
form:content-form:tableData1_expandedRowIndex:1
form:content-form:tableData1_encodeFeature:true
form:content-form:tableData1_skipChildren:true
form:form
form:content-form:form:content-form
form:content-form:j_idt25:jacob
form:content-form:searchTypeInput_focus:
form:content-form:searchTypeInput_input:applications
form:content-form:j_idt22_collapsed:false
form:content-form:tableData1_rppDD:10
form:content-form:tableData1:j_idt66:filter:
form:content-form:tableData1:j_idt68:filter:
form:content-form:tableData1:j_idt70:filter:
form:content-form:tableData1:j_idt72:filter:
form:content-form:tableData1:0:subTab:j_idt104:filter:
form:content-form:tableData1:0:subTab:j_idt106:filter:
form:content-form:tableData1:0:subTab:j_idt127:filter:
form:content-form:tableData1:0:subTab:j_idt130:true
form:content-form:tableData1:0:subTab:j_idt135:filter:
form:content-form:tableData1_rppDD:10
form:associatedLicenseTab_scrollState:0,0
form:secIssuesTab_scrollState:0,0
javax.faces.ViewState:2826785727933486875:1097834059221927593

[thapelong]

I will advice you to use primefaces 6.0 or version ahead of 5.3 because the sorting and filtering functionalities don't work properly on 5.3 version. The set rowStatePreserved="true" on the outer table. It worked for me.