A lightning:formattedName component displays formatted names in a given format and order. The locale set in the app's user preferences determines how names are formatted and the order they are presented.
This examples displays "Mr. John Middleton Doe The 3rd Jo" based on the default English United States locale with the long format.
<aura:component> <lightning:formattedName aura:id="myname" firstName="John" middleName="Middleton" lastName="Doe" informalName="Jo" suffix="The 3rd" salutation="Mr." /> </aura:component>
The format attribute determines the length of the name to be displayed.
Format | Description | Example |
---|---|---|
short | Displays the first name and last name only. | John Doe |
medium | Displays the first name, middle name, and last name only. | John Middleton Doe |
long (default) | Displays the name including salutation, first name, middle name, last name, suffix, informal name. | Mr. John Middleton Doe The 3rd Jo |
For more information on supported locales, see Supported Locales in the Salesforce Help.
To create a form that takes in user input for names, you can use the lightning:inputName component, which displays a name compound field that supports user input for salutation, suffix, and so on.
Attribute Name | Attribute Type | Description | Required? |
---|---|---|---|
body | Component[] | The body of the component. In markup, this is everything in the body of the tag. | |
class | String | A CSS class for the outer element, in addition to the component's base classes. | |
firstName | String | The value for the first name. | |
format | String | The format for which to display the name. Valid values include short, medium, and long. This value defaults to long. | |
informalName | String | The value for the informal name. | |
lastName | String | The value for the last name. | |
middleName | String | The value for the middle name. | |
salutation | String | The value for the salutation, such as Dr. or Mrs. | |
suffix | String | The value for the suffix. | |
title | String | Displays tooltip text when the mouse moves over the element. |