Thursday 24 October 2013

Display the special character on UI

This below blog we will see how to display special characters on UI.

You can use Unicode to display special charters on UI components. You may need to use the resource bundle to hold the Unicode values of the special characters, and the same can be referred from the UI using the key.

Resource bundle:

view.copyRightSymbol=\u00a9
view.heart=\u2764


UI Page:

<af:outputText value="Copyright #{viewcontrollerBundle['view.copyRightSymbol']} " id="ot1"/>    
<af:outputText value="Ram #{viewcontrollerBundle['view.heart']} Sita" id="ot2"/>


The output of the page is:
 
Thanks.. 

Specifying or check the Color for

This blog we will see how to specify and check the color for <af:inputColor>

The <af:inputColor> creates a text field for entering colors and a button for picking colors from a palette. The entering color format always follows #RRGGBB syntax.

Code:

<af:inputColor  label="Enter or select color from palette below" compact="false" id="id1"/>


Output: 

Thanks...

How to convert inputText to upperCase, lowerCase, capitalize

This blog we will see how to change the input text to upper case, lower case and capitalize (First character should be Capital).

To enforce the user to enter upper Case text uses this style:
<af:inputText label="Label 1" id="it1" contentStyle="text-transform:uppercase;"/>

To enforce the user to enter lower Case text use this style: 
<af:inputText label="Label 1" id="it1" contentStyle="text-transform:lowercase;"/>

To enforce the user to enter capitalize (InitCap) text use this style:
<af:inputText label="Label 1" id="it1" contentStyle="text-transform:capitalize;"/>

Thanks...