Update records using uiRecordApi in Lightning web components
Sometimes we need to update some fields after checking some conditions. It may be same record or some other records. for this we don't need to create apex class to do this. Salesforce does allow do this using uiRecordApi.
1. Import getRecord, getFieldValue, updateRecord methods from uiRecordApi.
[import {getRecord, getFieldValue, updateRecord} from 'lightning/uiRecordApi';]
2. Call the getRecord method to get current records field values.
[const fields = [OPPORTUNITY_NAME_FIELD, ACCOUNT_NAME_FIELD, ACCOUNT_ID_FIELD];// Wire method to get the data of fields@wire(getRecord, { recordId: '$recordId', fields })opportunity;]
3. Now call getFieldValue to get the field values.
[let oppName = getFieldValue(this.opportunity.data, OPPORTUNITY_NAME_FIELD);
//let oppName = this.opportunity.data.fields.Name.value; // Also access this way]
4. Now create an object of fields to update then pass that fields object to updateRecord method to update. here in field object Id field is mandatory to update.
[let fields = {Id: accId,Name: oppName}const recordInput = { fields };updateRecord(recordInput);]
Ex: We have an opportunity record, on opportunity details page, create a button to check and update the Name of opportunity should be same as account Name, if not then it will update account Name to match with opportunity.
updateRecordUsingUiRecordApi.html
[<template><lightning-button name="Update Name" label="Update Account Name" onclick={updateAccount}></lightning-button></template>]
updateRecordUsingUiRecordApi.js
[import { LightningElement, api, wire } from 'lwc';import {getRecord, getFieldValue, updateRecord} from 'lightning/uiRecordApi';import {ShowToastEvent} from 'lightning/platformShowToastEvent';import OPPORTUNITY_NAME_FIELD from '@salesforce/schema/Opportunity.Name';import ACCOUNT_NAME_FIELD from '@salesforce/schema/Opportunity.Account.Name';import ACCOUNT_ID_FIELD from '@salesforce/schema/Opportunity.Account.Id';const fields = [OPPORTUNITY_NAME_FIELD, ACCOUNT_NAME_FIELD, ACCOUNT_ID_FIELD];export default class UpdateRecordUsingUiRecordApi extends LightningElement {@api recordId; // get the current record id// Wire method to get the data of fields@wire(getRecord, { recordId: '$recordId', fields })opportunity;updateAccount(){/** we can access field values directly referencing the value* or you can use also use getFieldValue to get the value*/let oppName = getFieldValue(this.opportunity.data, OPPORTUNITY_NAME_FIELD);//let oppName = this.opportunity.data.fields.Name.value; // Also access this waylet accName = this.opportunity.data.fields.Account.value.fields.Name.value;let accId = getFieldValue(this.opportunity.data, ACCOUNT_ID_FIELD);if(oppName != accName){/** create an object of record which you are going to update,* Id field is mandatory, then add fields which are going to update*/let fields = {Id: accId,Name: oppName}const recordInput = { fields };updateRecord(recordInput).then(() =>{this.dispatchEvent(new ShowToastEvent({title: 'Success!',message: 'Account name updated successfully',variant: 'success'}))}).catch(error =>{this.dispatchEvent(new ShowToastEvent({title: 'Error!',message: 'Something went wrong while updating account',variant: 'error'}))})} else{this.dispatchEvent(new ShowToastEvent({title: 'Success',message: 'It\'s already updated',variant: 'success'}));}}}]
updateRecordUsingUiRecordApi.js-meta.xml
[<?xml version="1.0" encoding="UTF-8"?><LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata"><apiVersion>48.0</apiVersion><isExposed>true</isExposed><targets><target>lightning__RecordPage</target></targets></LightningComponentBundle>]
You can also find the above code in SWDC WORLD.
COMMENTS