Display p:dataTable Row Numbers - jsf

In mkyong example, they show How To Display DataTable Row Numbers In JSF. They use javax.faces.model.DataModel to get row index without using backing bean value. How to achieve this by using primfaces p:dataTable. Thanks.

In primefaces p:datatable component, the component has rowIndexVar attribute, which is used to iterate to refer each row index. Thus, you can do like my example below
<p:dataTable
var="cmr01Forms"
value="#{cmr01Bean.cmr01Forms}"
rowIndexVar="index">
<p:column>
<f:facet name="header">
<h:outputText value="index" />
</f:facet>
<h:outputText
value="#{index + 1}" />
</p:column>
</p:dataTable>

***
you can use rowindex. rowIndexVar="rowIndex". it starts with 0 so you
ve to plus 1 every row
<p:dataTable var="kat" value="#{kategoriBean.kategoriler}" rowIndexVar="rowIndex">
<!-- <p:column headerText="Kategori Id"> -->
<!-- <h:outputText value="#{kat.Id}" /> -->
<!-- </p:column> -->
<p:column headerText="NO">
<h:outputText value="#{rowIndex+1}"></h:outputText>
</p:column>
<p:column headerText="Kategori Adı">
<h:outputText value="#{kat.kategoriAdi}" />
</p:column>
<p:column>
<h:outputText value="#{kat.kategoriKisaAciklama}"></h:outputText>
</p:column>
</p:dataTable>

Related

Unable to send parameter from JSF to Bean through datatable value attribute

I have a expansion datatable which is being populated by an Arraylist from the backend wich has an id as primary key. When row is expanded, that id specific rows has to be searched in an another table and all the rows has to be displayed. when i am trying to pass the id as parameter in the value attribute, it's giving class cast exception.
here's the XHTML Code
<h:form>
<p:dataTable var="data"
value="#{trackerList.trackerList}">
<f:facet name="header">Summary</f:facet>
<p:column style="width:16px">
<p:rowToggler />
</p:column>
<p:column headerText="ID">
<h:outputText value="#{data.id}" />
</p:column>
<p:column headerText="Status">
<h:outputText value="#{data.status}" />
</p:column>
<p:column headerText="Created Time">
<h:outputText value="#{data.createdTime}" />
</p:column>
<p:column headerText="Created By">
<h:outputText value="#{data.createdby}" />
</p:column>
<p:column headerText="Updated By">
<h:outputText value="#{data.updatedby}" />
</p:column>
<p:rowExpansion>
<p:dataTable var="metadata" value="#{statusList.getScenarioStatusList(data.id)}">
<p:column headerText="Requirements">
<h:outputText value="#{metadata.requirements}" />
</p:column>
<p:column headerText="Exam Name">
<h:outputText value="#{metadata.examName}" />
</p:column>
<p:column headerText="Status">
<h:outputText value="#{metadata.status}" />
</p:column>
</p:dataTable>
</p:rowExpansion>
</p:dataTable>
</h:form>
Please Help.
i think you need to define below line inside the p:datatable tag with passing id as parameter and instead of #{statusList.getScenarioStatusList(data.id)} in sub datatable you just do value= "#{yourBean.scenarioStatusList}". populate scenarioStatusList in loadLists(data.id) method.
<p:ajax event="rowToggle" listener="#{yourBean.loadLists(data.id)}" />

SummaryRow in p:dataTable not working

I am trying to show a total value on my dataTable, my code is similar to the primefaces showcase DataTable - SummaryRow and still not working.
<p:dataTable id="dtCaixa" var="list" value="#{caixaMB.list}" paginator="true" rows="7"
paginatorPosition="bottom" rowsPerPageTemplate="10,15,20" liveScroll="true"
paginatorAlwaysVisible="false" emptyMessage="Nenhuma entrada!" liveResize="true">
<p:column headerText="Nome" sortBy="#{list.produtoFK.nome}" style="width:15%;">
<h:outputText value="#{list.produtoFK.nome}" />
</p:column>
<p:column headerText="Funcionário" sortBy="#{list.funcionarioFK.nome}">
<h:outputText value="#{list.funcionarioFK.nome}" />
</p:column>
<p:column headerText="Quantidade" sortBy="#{list.quantidade}">
<h:outputText value="#{list.quantidade}" />
</p:column>
<p:column headerText="Preço" >
<h:outputText value="#{list.produtoFK.preco}" rendered="#{not empty list.produtoFK}">
<f:convertNumber pattern="R$ #0.00" locale="pt_BR"/>
</h:outputText>
</p:column>
<p:column headerText="Total" sortBy="#{list.total}" >
<h:outputText value="#{list.total}" >
<f:convertNumber pattern="R$ #0.00" locale="pt_BR"/>
</h:outputText>
</p:column>
<p:column headerText="Remover" class="centered">
<p:commandButton icon="ui-icon-trash" title="excluir" onclick="PF('confirmaExclusao').show();">
<f:setPropertyActionListener target="#{caixaMB.itemSelecionado}" value="#{list}" />
</p:commandButton>
</p:column>
<p:summaryRow>
<p:column colspan="3" style="text-align:right">
<h:outputText value="Total:" />
</p:column>
<p:column>
<h:outputText value="#{caixaMB.total}">
</h:outputText>
</p:column>
</p:summaryRow>
</p:dataTable>
Does anybody have any idea why is this happening?
You need to sort the dataTable using at least one column if you want to use summaryRow. Check the Primefaces documentation.
E.g. put the attribute sortBy="#{myList.myOrderValue}" on the <p:datatable> tag.
I think what you're trying to achieve is the overall total of the column showing up at the bottom. I was caught out by the summaryRow function too, until I realised it was a grouping function and not a totalling summary. What I did you get around this was for the last column I added some footerText. You will have to calculate your totals manually (iterate over your dataset etc), then you can use something like:
<p:column style="text-align: right" footerText="$ #{invoicesbean.total}">
<f:facet name="header">
<h:outputText value="Amount" />
</f:facet>
........ etc
This worked well for me but YMMV!

Adding one row to p:dataTable

I want to add one row(hard coding) in the beginning of both columns. Can someone help me on how to implement it?
I am new to JSF so unable to get it.
<p:dataTable var="DataTableValue" value="#{showTableBean.list}">
<p:column headerText="Attribute" >
<h:outputText value="#{DataTableValue.attribute}" />
</p:column>
<p:column headerText="Vehicle Data">
<h:outputText value="#{DataTableValue.value}" />
</p:column>
</p:dataTable>

p:rowExpansion looks like another row of main p:dataTable

Is there any simple way to unify look of dataTable inside rowExpansion and main dataTable? Or dou you have any ideas to make it nice?
I want it to looks like hidden rows of the same dataTable.
Here is how it looks by default:
And here is default xhtml code:
<p:dataTable id="cars" var="car" value="#{carBean.someList}">
<f:facet name="header">
List of Cars
</f:facet>
<p:column style="width:16px">
<p:rowToggler />
</p:column>
<p:column headerText="Name">
<h:outputText value="#{car.user.name}" />
</p:column>
<p:columns value="#{scoresBean.otherList}" var="score" columnIndexVar="colIndex">
<f:facet name="header">
<h:outputText value="#{colIndex+1}" />
</f:facet>
<h:outputText value="#{car.scores[colIndex]}" />
</p:columns>
<p:rowExpansion>
<p:dataTable id="cycs" var="cyc" value="#{car.semiScoresList}">
<p:column>
<h:outputText value="#{cyc.partName}" />
</p:column>
<p:columns value="#{scoresBean.otherList}" var="score" columnIndexVar="col">
<h:outputText value="#{cyc.partsScores[col]}" />
</p:columns>
</p:dataTable>
</p:rowExpansion>
</p:dataTable>
You can't, not without a lot of css javascript etc. Use a p:treetable for this

JSF Primefaces datatable match mode for global filter (not individual column)

What is the filter match mode for global filter (not the individual column filter which defaults to 'startsWith') and how to change it?
The reason I ask is, when I use the global filter with match mode set to 'startsWith' in all my columns, still I get values with 'contains' filter mode. See screenshot below.
I shouldn't be getting the rows other than the first row as I specified 'startsWith' in all columns.
Here is my datatable,
<h:form id="countryTable">
<p:dataTable rowKey="" value="#{countryBean.countriesList}"
var="country" selection="#{countryBean.selectedCountries}"
styleClass="data-table-style" widgetVar="countryTableWVar"
filteredValue="#{countryBean.filteredCountries}">
<f:facet name="header">
<div class="align-left">
<p:outputPanel>
<h:outputText value="Search all fields:" />
<p:inputText id="globalFilter" onkeyup="countryTableWVar.filter();"
style="width:150px" />
</p:outputPanel>
</div>
</f:facet>
<p:column selectionMode="multiple" style="width:2%;" />
<p:column headerText="Numeric Code" filterMatchMode="startsWith"
filterStyle="display:none" filterBy="numericCode">
<h:outputText value="#{country.numericCode}"></h:outputText>
</p:column>
<p:column headerText="Alpha_2 Code" filterMatchMode="startsWith"
filterStyle="display:none" filterBy="alpha2">
<h:outputText value="#{country.alpha2}"></h:outputText>
</p:column>
<p:column headerText="Alpha_3 Code" filterMatchMode="startsWith"
filterStyle="display:none" filterBy="alpha3">
<h:outputText value="#{country.alpha3}"></h:outputText>
</p:column>
<p:column headerText="Name" filterMatchMode="startsWith"
filterStyle="display:none" filterBy="name">
<h:outputText value="#{country.name}"></h:outputText>
</p:column>
</p:dataTable>
</h:form>
How to change the datatable global filter match mode?
If you look at the source code of primefaces
org.primefaces.component.datatable.feature.FilterFeature.java
At line 133 you can see primefaces uses contains method of String
if(columnValue.toLowerCase(filterLocale).contains(globalFilter)){
globalMatch = true;
}
So for now there is no way other than changing code according to your needs and building your own primefaces jar.
From Primefaces 4.0 docs:
Filter located at header is a global one applying on all fields, this is implemented by calling client
side API method called filter(), important part is to specify the id of the input text as globalFilter
which is a reserved identifier for datatable.
The use case would be:
<p:dataTable var="car" value="#{carBean.cars}"
filteredValue="#{carBean.filteredCars}" widgetVar="carsTable">
<f:facet name="header">
<p:outputPanel>
<h:outputText value="Search all fields:" />
<h:inputText id="globalFilter" onkeyup="PF('carsTable').filter()" />
</p:outputPanel>
</f:facet>
<p:column filterBy="model" headerText="Model" filterMatchMode="contains">
<h:outputText value="#{car.model}" />
</p:column>
<p:column filterBy="year" headerText="Year" footerText="startsWith">
<h:outputText value="#{car.year}" />
</p:column>
<p:column filterBy="manufacturer" headerText="Manufacturer"
filterOptions="#{carBean.manufacturerOptions}" filterMatchMode="exact">
<h:outputText value="#{car.manufacturer}" />
</p:column>
<p:column filterBy="color" headerText="Color" filterMatchMode="endsWith">
<h:outputText value="#{car.color}" />
</p:column>
</p:dataTable>
It doesn't tell anything about startsWithor endsWith specific cases for global filter. It could be interesting to open a thread on the issue tracker.

Resources