+ Start a Discussion
MMA_FORCEMMA_FORCE 

Format Number with comma and decimal

Hi all:

  I was wondering if anyone knew how to format a number in VF so that it has a comma and decimal...

for example

40000 would be 40,000.00

So far I have this:

 

<apex:outputText value="{0}.{1}"> <apex:param value="{!SUBSTITUTE(TEXT(FLOOR(item.Unit_Price__c)), ',', '.' )}"/> <apex:param value="{!RIGHT(TEXT(ROUND((item.Unit_Price__c * 100), 2)),2)}"/> </apex:outputText>

 The second one gets the digits after the decimal. but the number shows up as 40000.00

How do I get the comma in there now...

Someone pleaseeee help with any ideas...

 

 

MMA_FORCEMMA_FORCE

Vote for my idea on this topic:

Currency/Number Format

Goblin235Goblin235

 

I just had to deal with the same issue when rendering a bunch of product prices when using the "Quote with Line Items" package for the quote PDF... and the only way I could get it to work was to just brute force the formatting...

 

A couple of notes about approaches that I tried and failed at getting to work:

 

  • Trying to use Javascript formatting doesn't work when rendering the Visualforce page as a PDF...  (that was my issue for not reading the manual first)
  • Despite the Visualforce documentation stating that the outputText tag supports "the same syntax as the MessageFormat class in Java. For more information on the MessageFormat class, see http://java.sun.com/j2se/1.4.2/docs/api/java/text/MessageFormat.html."

    I could never get the {0, number, currency} approach to work...  dates seem to work using {0, date, long} for formatting, but the number approach always causes an error in the PDF generation (maybe I was doing something wrong, but who knows)


So my solution for numbers up to $999,999.99:

 

 

<!-- Prints the leading "$" -->
<apex:outputText value="$"/>

<!-- Prints the "XXX," and only renders if required -->
<apex:outputText value="{!floor(line.Unit_Price__c / 1000)}," rendered="{!floor(line.Unit_Price__c / 1000) > 0}"/>

<!-- Prints the XXX before the decimal -->
<apex:outputText value="{!floor(mod(line.Unit_Price__c, 1000))}"/>

<!-- The decimal -->
<apex:outputText value="."/>

<!-- The tenths value -->
<apex:outputText value="{!floor(mod(line.Unit_Price__c, 1)*10)}"/>

<!-- The hundredths value -->
<apex:outputText value="{!floor(mod(line.Unit_Price__c, 0.1)*100)}"/>

 

 

I used the same approach for percentages and whole number quantities.  Hope this helps!

 

 

Goblin235Goblin235

Update... my mistake... the previous code has an error in that it doesn't include "zero padding" when a number has a leading zero or two zeros after a comma, so $12,050,079.23 would print as $12,50,79.23 which clearly isn't correct.  So here is a full brute force that calculates and prints each digit up to $999,999,999.99

 

 

 

<apex:outputText value="$"/> <apex:outputText value="{!floor(line.Unit_Price__c/(10^6))}," rendered="{!floor(line.Unit_Price__c/(10^6))>0}"/> <apex:outputText value="{!floor(line.Unit_Price__c/(10^5))-floor(line.Unit_Price__c/(10^6))*10}" rendered="{!floor(line.Unit_Price__c/(10^5))>0}"/> <apex:outputText value="{!floor(line.Unit_Price__c/(10^4))-(floor(line.Unit_Price__c/(10^5))*10)}" rendered="{!floor(line.Unit_Price__c/(10^4))>0}"/> <apex:outputText value="{!floor(line.Unit_Price__c/(10^3))-(floor(line.Unit_Price__c/(10^4))*10)}," rendered="{!floor(line.Unit_Price__c/(10^3))>0}"/> <apex:outputText value="{!floor(line.Unit_Price__c/(10^2))-(floor(line.Unit_Price__c/(10^3))*10)}" rendered="{!floor(line.Unit_Price__c/(10^2))>0}"/> <apex:outputText value="{!floor(line.Unit_Price__c/10)-(floor(line.Unit_Price__c/(10^2))*10)}" rendered="{!floor(line.Unit_Price__c/10)>0}"/> <apex:outputText value="{!floor(line.Unit_Price__c)-(floor(line.Unit_Price__c/10)*10)}"/> <apex:outputText value="."/> <apex:outputText value="{!floor(line.Unit_Price__c/0.1)-(floor(line.Unit_Price__c)*10)}"/> <apex:outputText value="{!floor(line.Unit_Price__c/0.01)-(floor(line.Unit_Price__c/0.1)*10)}"/>

 


 

ahab1372ahab1372

what I have seen in the "Quote with Lines" App (and used) is to create a shadow field of the desired type (currency) that is not displayed in the layout but used to store any temporary values. If you use this field in VF, it will be formatted correctly. Any value is usually not written backinto the database.

Not sure if that is applicable to your use case.

DuncanStewartDuncanStewart

Do you have an example where you actually use it? 

 

(not that I wouldn't rather/also like to see an apex attribute called format that would allow a basic format="#,##0.00" )

Message Edited by DuncanStewart on 06-09-2009 01:20 PM
sandersensandersen

I did this in a Controller using a slightly different technique:

 

 

public String formatDouble(Decimal myNumber,Boolean isCurrency){

String formattedString = '';

String myNumberAsString = String.valueOf(myNumber);

if (isCurrency){

formattedString = '$';

}

if(myNumber>999999999){

formattedString += myNumberAsString.substring(0,myNumberAsString.length()-9)+ ',' + myNumberAsString.substring(myNumberAsString.length()-9,myNumberAsString.length()-6) + ',' + myNumberAsString.substring(myNumberAsString.length()-6,myNumberAsString.length()-3) + ',' + myNumberAsString.substring(myNumberAsString.length()-3,myNumberAsString.length());

} else if(myNumber>999999){

formattedString += myNumberAsString.substring(0,myNumberAsString.length()-6)+ ',' + myNumberAsString.substring(myNumberAsString.length()-6,myNumberAsString.length()-3) + ',' + myNumberAsString.substring(myNumberAsString.length()-3,myNumberAsString.length());

} else if(myNumber>999){

formattedString += myNumberAsString.substring(0,myNumberAsString.length()-3)+ ',' + myNumberAsString.substring(myNumberAsString.length()-3,myNumberAsString.length());

} else {

formattedString += myNumberAsString;

}

return formattedString;

}

 Hope that's helpful,

 

Steve 

 

 

Message Edited by sandersen on 12-09-2009 08:50 AM
Dogen ZenjiDogen Zenji

I have had success in a VisualForce page renderred normally and as PDF using the following syntax...

 

<apex:outputText value="${0, number, ###,###,###,###.00}"> <apex:param value="{!t.Transaction_Amount}"/> </apex:outputText>

 The field you are binding to is passed in as a parameter to your outputText component and formatted using the data type and Java formatting string within the curly brackets.  The formatting also works with date fields...

 

<apex:outputText value="{0, date, MMMM d, yyyy}"> <apex:param value="{!t.Driver_Settlement_Date}"/> </apex:outputText>

 

 

 

 

raorao

The above solution works fine in most of the cases.  But when the value is 0, it shows as .00 but not as 0.00

 

Dogen ZenjiDogen Zenji

In that case use the format string ###,###,###,##0.00 as below...

 

<apex:outputText value="${0, number, ###,###,###,##0.00}">
raorao
Thanks Dogen.  Its working.
rgdcrgdc

  I Have:

 

 "

<apex:outputText value="$ {0, number, ###,###,###,##0.00}">                   

<apex:param value="{!F.Price}"/>               

</apex:outputText>

 "

 

And is displayed: $ 200,450,601.00

 

 

But I want to display $ 200.450.601,00

 

And when I write: 

 

</apex:outputText>

<apex:outputText value="$ {0, number, ###.###.###.##0.00}">

 "

 

The visualForce displayed a message of error.

 

 

How Can I solved my problem ?

 

Dogen ZenjiDogen Zenji

I assume you meant when you tried...

 

<apex:outputText value="$ {0, number, ###.###.###.##0,00}">

 

... it did not work.  I think the reason may be that the underlying format function thinks the last two zeroes are a forth argument because of the comma.  I haven't tried this but can you try escaping that last comma with a backslash or double backslash like so...

 

<apex:outputText value="$ {0, number, ###.###.###.##0\,00}">

OR

<apex:outputText value="$ {0, number, ###.###.###.##0\\,00}">

 

 

rgdcrgdc

Thank you for Help, but displayed the message:

 

 

Error: The standard format for <apex:outputText> number is invalid.

 '

<apex:outputText value="$ {0, number, ###.###.###.##0\\,00}">

                    <apex:param value="{!F.Preco_objetivo__c}"/>              

</apex:outputText>

 '

or 

 '

</apex:outputText>

<apex:outputText value="$ {0, number, ###.###.###.##0\,00}">

 <apex:param value="{!F.Preco_objetivo__c}"/>              

 '

 

Do I could to put the function substitute ?

JFraileJFraile

Hi.

 

Did you get to solve the problem? 

 

Thanks

Patrick-Emil ZörnerPatrick-Emil Zörner
Will this be fixed anytime in the near future?
Ayse StinnettAyse Stinnett
With @Goblin235's answer, I was throwing "javax.faces.FacesException: core.apexpages.exceptions.ApexPagesDeveloperException: The value 'null' is not valid for operator '>' "; however, I took that as a start and ended up with a format that works (soley in vf).:

 <div style="Display:{!(IF(op.International_Unit_Price__c != NULL, "Display", "None"))}">
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/(10^6))}." rendered="{!(IF(floor(op.International_Unit_Price__c/(10^6)) != NULL && floor(op.International_Unit_Price__c/(10^6)) > 0, true, false))}"/>
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/(10^5))-floor(op.International_Unit_Price__c/(10^6))*10}" rendered="{!(IF(floor(op.International_Unit_Price__c/(10^5)) != NULL && floor(op.International_Unit_Price__c/(10^5)) > 0, true, false))}"/>
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/(10^4))-(floor(op.International_Unit_Price__c/(10^5))*10)}" rendered="{!(IF(floor(op.International_Unit_Price__c/(10^4)) != NULL && floor(op.International_Unit_Price__c/(10^4)) > 0, true, false))}"/>
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/(10^3))-(floor(op.International_Unit_Price__c/(10^4))*10)}." rendered="{!(IF(floor(op.International_Unit_Price__c/(10^3)) != NULL && floor(op.International_Unit_Price__c/(10^3)) > 0, true, false))}"/>
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/(10^2))-(floor(op.International_Unit_Price__c/(10^3))*10)}" rendered="{!(IF(floor(op.International_Unit_Price__c/(10^2)) != NULL && floor(op.International_Unit_Price__c/(10^2)) > 0, true, false))}"/>
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/10)-(floor(op.International_Unit_Price__c/(10^2))*10)}" rendered="{!(IF(floor(op.International_Unit_Price__c/(10^1)) != NULL && floor(op.International_Unit_Price__c/(10^1)) > 0, true, false))}"/>
                        <apex:outputText value="{!floor(op.International_Unit_Price__c)-(floor(op.International_Unit_Price__c/10)*10)}" rendered="{!(IF(floor(op.International_Unit_Price__c) != NULL && floor(op.International_Unit_Price__c) > 0, true, false))}"/>
                        <apex:outputText value=","/>
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/0.1)-(floor(op.International_Unit_Price__c)*10)}"/> 
                        <apex:outputText value="{!floor(op.International_Unit_Price__c/0.01)-(floor(op.International_Unit_Price__c/0.1)*10)}"/>&euro; 
                    </div>
---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
With a number in op.International_Unit_Price__c that formats to $33,454.00 with standard apex:outputText styling, I output 33.454,00€ with this code.