Thursday, July 3, 2014

Date and Number Format in Visualforce Page.

Date and Number Format in Visualforce Page.


Hi,
Here is the example of Date and Number Format in Visualforce Page.

VF Page:
<apex:page title="Date and Number Formatting in Visualforce Page">
<style>
.tableContent {
border: 1px solid green;
font: 12px, Verdana;
}
.tableHeader {
background-color: green;
font: 16px, Verdana;
color: white;
}
.bold {
font-weight: bold;
}
</style>
<table border="0" cellspacing="2" cellpadding="6" class="tableContent">
<tr class="tableHeader">
<th>
    Format
</th>
<th>
    Input
</th>
<th>
    Output
</th>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, date, short}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!NOW()}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, date, short}">
        <apex:param value="{!NOW()}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, date, medium}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!NOW()}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, date, medium}">
        <apex:param value="{!NOW()}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, date, long}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!NOW()}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, date, long}">
        <apex:param value="{!NOW()}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, date, full}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!NOW()}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, date, full}">
        <apex:param value="{!NOW()}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, date, yyyy-mm-dd hh:mm:ss a}" styleClass="bold"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!NOW()}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, date, yyyy-MMM-dd hh:mm:ss a z}">
        <apex:param value="{!NOW()}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, number, integer}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!VALUE('123.456')}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, number, integer}">
        <apex:param value="{!VALUE('123.456')}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, number, currency}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!VALUE('123.456')}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, number, currency}">
        <apex:param value="{!VALUE('123.456')}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, number, percent}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!VALUE('0.5')}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, number, percent}">
        <apex:param value="{!VALUE('0.5')}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, number, 0000.0}" styleClass="bold"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!VALUE('123.456')}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, number, 0000.0}">
        <apex:param value="{!VALUE('123.456')}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, number, ####.#}" styleClass="bold"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!VALUE('123.456')}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, number, ####.#}">
        <apex:param value="{!VALUE('123.456')}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, number, 0.0000}" styleClass="bold"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!VALUE('123.456')}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, number, 0.0000}">
        <apex:param value="{!VALUE('123.456')}"></apex:param>
    </apex:outputtext>
</td>
</tr>
<tr>
<td>
    <apex:outputtext value="{0, number, #.####}" styleClass="bold"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{!VALUE('123.456')}"></apex:outputtext>
</td>
<td>
    <apex:outputtext value="{0, number, #.####}">
        <apex:param value="{!VALUE('123.456')}"></apex:param>
    </apex:outputtext>
</td>
</tr>
</table>
</apex:page>


Output:





3 comments:

chp said...

Nice helpful post. Thanks, particularly for the visual representation.

Ajay Hada said...

thanks. it was useful.

Unknown said...

I want Display In Indian Currency Format 1,00,000.00
Please Help me
thanks.

Post a Comment

 
| ,