Lesson: 23 | Edit a Record

recordId will get the Id of the related record.

HTML

<template>
    <lightning-record-edit-form record-id={recordId} object-api-name="Contact"
            onsuccess={handleSuccess} onsubmit ={handleSubmit}>
        <lightning-messages>
        </lightning-messages>
        <lightning-output-field field-name="AccountId">
        </lightning-output-field>
        <lightning-input-field field-name="FirstName">
        </lightning-input-field>
        <lightning-input-field field-name="LastName">
        </lightning-input-field>
        <lightning-input-field field-name="Email">
        </lightning-input-field>
        <lightning-button class="slds-m-top_small" variant="brand" type="submit" name="edit" label="Edit">
        </lightning-button>
    </lightning-record-edit-form>
</template>

JavaScript

import { LightningElement, api} from 'lwc';
export default class EditAccount extends LightningElement {
    @api recordId;
    handleSubmit(event) {
        console.log(event.detail.fields);
    }
    handleSuccess(event) {
        console.log(event.detail.id);
    }
}

XML

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" fqn="editRecord1">
    <apiVersion>46.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__RecordPage</target>
    </targets>
</LightningComponentBundle>

Prev You need to login to have access to the quizzes. Next

Mastered by 14 users.

Go to top

Login to your account

Lesson: 23 | Edit a Record

HTML