I have a p:dataTable with a pe:toolTip appended for all cells. The tooltip text is displaying ok, but it doesnt apply the f:convertNumber format that I have for my table cells:
My columns look like this:
<h:outputText value="#{informeAux.vagonesKm}" title="#{informeAux.vagonesKm}">
<f:convertNumber maxFractionDigits="2" minFractionDigits="2"/>
</h:outputText>
And the number in the table looks like this: 11.335,40 but the Tooltip displays the value like this: 11335.4 (Number is not formatted)
Haven't found a way to properly display it, any help will be appreciated.
I tried to use the converter attribute for the <pe:tooltip> but couldn't get it working.
In the end I made a separate property 'vagonesKmTitle' and applied the decimal format in my bean.
<h:outputText value="#{informeAux.vagonesKm}" title="#{informeAux.vagonesKmTitle}">
<f:convertNumber maxFractionDigits="2" minFractionDigits="2"/>
</h:outputText>
Related
Please help me to round values (example: from 4.23 to 4 and 4.5 to 5). I have code such as below. I need do this on my frontend part:
<p:column
styleClass="#{SomeClass.getAnotherSomething(row.magicCategory)}">
<h:outputLabel value="#{empty row.papaja ? 'N/A' : row.papaja}"
styleClass="textChangesInCells"
pt:data-selenium="papaja" />
</p:column>
You need to use h:outputText instead of h:outputLabel. With h:outputText you can use f:convertNumber to format a numeric value. With format="0" it'll round the value. So:
<h:outputText value="#{row.papaja}">
<f:convertNumber pattern="0"/>
</h:outputText>
To handle 'N/A', you need to do a check using c:if, c:choose, or use rendered attributes.
So the relevant sections of my code is:
<h:panelGroup id="pnlGrp" style="padding:10px" width="100%">
<div>
<h:dataTable id="availableCrList"
value="#{searchData.availableCrList}"
var="avail"
varStatus="thisVarStatus" rows="#{searchData.rowsPerPage}"
sortColumn="#{searchData.crSortColumnName}"
sortAscending="#{searchData.crAscending}" style="width:100%;">
<h:column>
<ui:repeat value="#{avail.crRsnCdList}"
var="crRsnCd"
varStatus="status">
<h:outputText value="#{crRsnCd}<br />"
title="#{avail.crRsnDescList[status.index]}"
escape="false"/>
</ui:repeat>
</h:column>
</h:dataTable>
</div>
</h:panelGroup>
I'm working inside a legacy application and my goal is to display a list of codes which indicate reasons why a given item in this table might be completed, or cancelled, et cetera. The title is converted into a hovering tooltip which displays the description for each of these codes.
Now, I managed to get this working for singular codes no problem, but since switching from a String to a List of strings it's been a nightmare trying to get this to work.
Right now with the above code it displays the codes correctly the first time, but when I update the datatable by searching for a new value all the other columns (not shown) are correctly displayed while the RsnCd column continues to display the same data from the first search.
As an example, the first time I search for records the datatable might pull up:
Row1:A1
Row2:A1
Row3:A1
A3
Row4:A1
The second time I search for data I would expect to see only:
Row1:
Row2:
Row3:
Row4:
Row5:
Row6:
Row7:
But instead I get:
Row1:A1
Row2:A1
Row3:A1
A3
Row4:A1
Row5:
Row6:
Row7:
Really not sure if I'm explaining this adequately/understandably.
I solved this issue by changing
<ui:repeat value="#{avail.crRsnCdList}"
var="crRsnCd"
varStatus="status">
<h:outputText value="#{crRsnCd}<br />"
title="#{avail.crRsnDescList[status.index]}"
escape="false"/>
</ui:repeat>
To:
<ice:column>
<ice:repeat value="#{avail.crRsnCdList}"
varStatus="status">
<ice:outputText value="#{avail.crRsnCdList[status.index]}<br />"
title="#{avail.crRsnDescList[status.index]}"
escape="false"/>
</ice:repeat>
</ice:column>
I tried getting rid of the value but it stopped displaying anything.
Related to the question Display formatted decimal numbers in Primefaces 4, how can I display - in a PrimeFaces datatable - a number masked like this:
1.987.654,32
The original data, which are read from a float column in SQLServer database table, is (e.g.):
1987654.32
I've tried the code below, but no success:
<p:column sortBy="#{item.value}" filterBy="#{item.value}">
<f:facet name="header">
<h:outputText value="#{epoBundle.ListUpbTitle_value}"/>
</f:facet>
<h:outputText value="#{item.value}">
<f:convertNumber pattern="#0.000" locale="pt_BR"/>
</h:outputText>
</p:column>
Thanks in advance.
The correct pattern for the <f:convertNumber .../> you want is: ###,###.000. You can read more about decimal formatting here: http://docs.oracle.com/javase/tutorial/i18n/format/decimalFormat.html
Bonus: for different masks, you can use other locales: https://stackoverflow.com/a/11836387/1362049
I wonder how to validate an inputText text field and see if it matchs a decimal format.
And also in the rendering time how to format that text field with a specific format
I've done this :
<rich:column id="soldes_comptables">
<f:facet name="header">
<h:outputText value="Solde Comptable" />
</f:facet>
<h:inputText id="inputTextSC" value="#{file.soldes_comptables}"
label="Montant"
style="border-color:#F2F3F7;"
validatorMessage="The number must be decimal eg: 000.00"
>
<f:convertNumber pattern="#,###,##0.00"/>
<f:validateRegex pattern="^[0-9]+(\.[0-9]{1,2})?$"></f:validateRegex>
<rich:validator />
</h:inputText>
<rich:message for="inputTextSC"/>
</rich:column>
but it's not working as i want :(. please help me
You're mixing validation and conversion. The <f:validateRegex> applies only on String values, not on Number values, however, the <f:convertNumber> has already converted it from String to Number beforehand, so the <f:validateRegex> is rather useless to you. You should remove it and specify the message as converterMessage instead.
<h:inputText ... converterMessage="The number must be decimal eg: 000.00">
<f:convertNumber pattern="#,###,##0.00"/>
</h:inputText>
An alternative would be to create a custom converter extending NumberConverter and throw a ConverterException on improper input format based on some regex pattern matching.
See also:
validating decimals inputs in JSF
How validate number fields with validateRegex in a JSF-Page?
I am rendering a table with p:dataTable (PrimeFaces) and what I want to do is color the background of cells depending on the value of their content. This is different from coloring a row or a column -- it is the individual cell.
First a CSS problem. If I do this:
<p:column headerText="xyzzy">
<div style="background-color: green">
<h:outputText value="#{rowVar.anumber}" >
<f:convertNumber groupingUsed="true" />
</h:outputText>
</div>
</p:column>
the background color just of the content gets set, not the whole cell. In other words the padding is still the default.
Second, I want to make the style string a variable expression. I can add a function to the backing bean, but how do I access the table content in the method? Will this work?
<div style="#{bean.computeCSS(rowVar.number}">
EDIT:
I figured out a way to do the conditional part, but I still need help with the CSS part. My solution looks like:
<p:column headerText="xyzzy">
<div class="#{rowVar.anumber gt 0 ? 'colored' : ''}">
<h:outputText value="#{rowVar.anumber}">
<f:convertNumber groupingUsed="true" />
</h:outputText>
</div>
</p:column>
Although I dislike getting to fancy in EL, this has the advantage of not needed a backing bean method.
However I still only get the background color set, not the whole cell.
You can add a css class to the row and to the column too, that identifies a cell.
Use the dataTable's rowStyleClass attribute (example).
If you want to color multiple rows:
<p:dataTable value="#{bean.rows}" var="rowVar"
rowStyleClass="#{rowVar.firstCol gt 0 ? 'firstColColored' : ''}
#{rowVar.secondCol gt 0 ? 'secondColColored' : ''}">
<p:column styleClass="firstCol">...
<p:column styleClass="secondCol">
css:
.firstColColored .firstCol {
background: pink;
}
how about adding padding to your class , with px or percents...
something like this
.colored{
background-color:yellow;
padding-top:25px;
padding-bottom:25px;
padding-right:50px;
padding-left:50px;
}