Scroll

Formatting Options

The form element labels and headers support additional HTML tags to provide rich text formatting.

Here's an example of a basic form field:

 

There is no special formatting on this field so in the form view it looks like this:

 

 

As an example let's underline the word 'Patient' as seen above. We can use the <u> HTML tag to underline the patient name:

 

 

Now our form preview shows:

 

 

 

Date Formatting

If the data you are trying to display is a date, you can format the date into a variety of formats.

The structure is

{{caze.dateValue | date:'format_name_here'}}

Example:

{{caze.dateValue | date:'medium'}}

Example display:

Sep 3, 2010 12:05:08 PM

 

 

The following formats will display the date in the user locale:

 

  • 'medium': equivalent to 'MMM d, y h:mm:ss a' for en_US locale (e.g. Sep 3, 2010 12:05:08 PM)

  • 'short': equivalent to 'M/d/yy h:mm a' for en_US locale (e.g. 9/3/10 12:05 PM)
  • 'fullDate': equivalent to 'EEEE, MMMM d, y' for en_US locale (e.g. Friday, September 3, 2010)
  • 'longDate': equivalent to 'MMMM d, y' for en_US locale (e.g. September 3, 2010)
  • 'mediumDate': equivalent to 'MMM d, y' for en_US locale (e.g. Sep 3, 2010)
  • 'shortDate': equivalent to 'M/d/yy' for en_US locale (e.g. 9/3/10)
  • 'mediumTime': equivalent to 'h:mm:ss a' for en_US locale (e.g. 12:05:08 PM)
  • 'shortTime': equivalent to 'h:mm a' for en_US locale (e.g. 12:05 PM)

 

You can also customize the format if desired:

  • 'yyyy': 4 digit representation of year (e.g. AD 1 => 0001, AD 2010 => 2010)
  • 'yy': 2 digit representation of the year, padded (00-99). (e.g. AD 2001 => 01, AD 2010 => 10)
  • 'y': 1 digit representation of year, e.g. (AD 1 => 1, AD 199 => 199)
  • 'MMMM': Month in year (January-December)
  • 'MMM': Month in year (Jan-Dec)
  • 'MM': Month in year, padded (01-12)
  • 'M': Month in year (1-12)
  • 'dd': Day in month, padded (01-31)
  • 'd': Day in month (1-31)
  • 'EEEE': Day in Week,(Sunday-Saturday)
  • 'EEE': Day in Week, (Sun-Sat)
  • 'HH': Hour of day, padded (00-23)
  • 'H': Hour of day (0-23)
  • 'hh': Hour in AM/PM, padded (01-12)
  • 'h': Hour in AM/PM, (1-12)
  • 'mm': Minute in hour, padded (00-59)
  • 'm': Minute in hour (0-59)
  • 'ss': Second in minute, padded (00-59)
  • 's': Second in minute (0-59)
  • 'sss': Millisecond in second, padded (000-999)
  • 'a': AM/PM marker
  • 'Z': 4 digit (+sign) representation of the timezone offset (-1200-+1200)
  • 'ww': Week of year, padded (00-53). Week 01 is the week with the first Thursday of the year
  • 'w': Week of year (0-53). Week 1 is the week with the first Thursday of the year
  • 'G', 'GG', 'GGG': The abbreviated form of the era string (e.g. 'AD')
  • 'GGGG': The long form of the era string (e.g. 'Anno Domini')

 

Additional Examples

  • Color

<span style="color: red">Red Color</span>

  • Bold

<b>Bold!</b>

  • Italic

<i>Italic!</i>

  • Underline

<u>Underlined!</u>

  • Combine Multiple

<b style="color: red"><u>Red Bold!</u></b>

 

You can learn more about HTML and additional formatting options here: HTML Tutorial

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request

Comments: 0