lightning:recordEditForm

Represents a record edit layout that displays one or more fields, provided by lightning:outputField. This component requires API version 41.0 and later.

A lightning:recordEditForm component is a wrapper component that accepts a record ID and is used to display one or more fields and labels associated with that record using lightning:inputField. lightning:recordEditForm requires a record ID to display the fields on the record. It doesn't require additional Apex controllers or Lightning Data Service to display record data. This component also takes care of field-level security and sharing for you, so users see only the data they have access to.

lightning:recordEditForm and lightning:inputField support the following features.

  • Display a record edit layout for editing a specified record
  • Display a record create layout for creating a new record

If a lightning:button component with type="submit" is provided for the record edit layout and it's clicked, the component automatically performs error handling and saves any changes in the input fields. Similarly, if the button is provided for the record create layout and it's clicked, error handling is automatically performed and a new record is created with the input data you provide. You must include lightning:messages to support error handling and displaying of error messages. Additionally, this component provides basic input validation. For example, entering an invalid email format for the Email field results in an error message when you try to submit the change. Similarly, a required field like the Last Name field displays an error message when you try to submit the change and the field is blank.

Editing a Record

To enable record editing, pass in the ID of the record and the corresponding object API name to be edited. Specify the fields you want to include in the record edit layout using lightning:inputField.

<aura:component>
    <lightning:recordEditForm recordId="003XXXXXXXXXXXXXXX" objectApiName="Contact">
        <lightning:messages />
        <lightning:inputField fieldName="FirstName" />
        <lightning:inputField fieldName="LastName" />
        <lightning:inputField fieldName="Email" />
        <lightning:button variant="brand" type="submit" name="update" label="Update" />
    </lightning:recordEditForm>
</aura:component>
Creating a Record

To enable record creation, pass in the object API name for the record to be created. Specify the fields you want to include in the record create layout.

<aura:component>
    <lightning:recordEditForm aura:id="recordEditForm" 
                           objectApiName="Contact">
        <lightning:messages />
        <lightning:inputField fieldName="Name" />
        <lightning:button type="submit" label="Create new" />
    </lightning:recordEditForm>
</aura:component>
Displaying Forms Based on a Record Type

If your org uses record types, picklist fields display values according to your record types. You must provide a record type ID using the recordTypeId attribute if you have multiple record types on an object and you don't have a default record type.

To locate the ID of a record type, use the following SOQL query.

Select Id, Name From RecordType Where SobjectType = 'Contact'
Working with the Edit Layout

To create a multi-column layout for your record edit layout, use the Grid utility classes in Lightning Design System. This example creates a two-column layout.

<aura:component>
    <lightning:recordEditForm recordId="003XXXXXXXXXXXXXXX" objectApiName="Contact">
        <div>
            <div>
                <!-- Your lightning:inputField components here -->
            </div>
            <div>
                <!-- More lightning:inputField components here -->
            </div>
        </div>
    </lightning:recordEditForm>
</aura:component>
Usage Considerations

The lookup type is supported in Lightning Experience only. When used in the mobile app, the lookup type is rendered as an input text field. The geolocation compound field is not supported. Read-only fields are displayed as input fields that are disabled. When usinglightning:inputField, rich text fields can't be used for image uploads.

For supported objects, see the User Interface API Developer Guide.

Events

The onerror action returns the following parameter.

Parameter Type Description
error Object The error data returned by the form submission.
  • errorCode: An error code with information about the error, for example, INSUFFICIENT_PRIVILEGES
  • message: Description of error. We recommend using lightning:messages to display your error messages in the UI.

The onload action returns the following parameter.

Parameter Type Description
recordUi Object The object metadata. For more information, see the User Interface API Developer Guide.

The onsubmit action returns the following parameter.

Parameter Type Description
fields Object The fields that are provided for submission during a record create. For example, if you include a lightning:inputField component with the Name field, fields returns FirstName, LastName, and Salutation.

The onsuccess action returns the following parameter.

Parameter Type Description
response Object[] The response data associated with the record during a record create or edit.
  • apiName: The record’s API name, such as Contact.
  • childRelationships: The child relationship data for this record.
  • fields: The field data for this record, matching the requested layout.
  • id: The ID of this record.
  • recordTypeInfo: The record type info for this record, if any.

Attributes

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.
objectApiName String The API name of the object. Yes
onerror Action The action triggered when there is an error on form submission.
onload Action The action triggered when the form data is loaded.
onsubmit Action The action triggered when the form is submitted.
onsuccess Action The action triggered when the form is saved.
recordId String The ID of the record to be displayed.
recordTypeId String The ID of the record type, which is required if you created multiple record types but don't have a default.