Introduction

The main concept included in this recipe is creating a record using the createRecord @wireadapter.

This adapter allows the easiest way to create a record without any server code required.

<aside> 💡 Review this page to get familiarized with LDS base components and adapters: ‣.

</aside>

<aside> 📁 You can find this LWC in this relative path: force-app\\main\\default\\lwc\\ldsCreateRecord

</aside>

Template file

The template uses 2 lightning-input elements:

  1. Labeled with Id the first input is used to show the record Id, when the record is created. It has the attribute disabled meaning is not editable by the user.
  2. Labeled with Name , this input is used to capture the name of the account from the user input.
    1. For every character typed the handleNameChangeis invoked

Finally, we have a button that is attached to the createAccount handler function.

...
	<div class="slds-var-m-around_medium">
	    <lightning-input
	        label="Id"
	        disabled
	        data-id="accountId"
	        value={accountId}
	    ></lightning-input>
	    <lightning-input
	        label="Name"
	        onchange={handleNameChange}
	        class="slds-var-m-bottom_x-small"
	    ></lightning-input>
	    <lightning-button
	        label="Create Account"
	        variant="brand"
	        onclick={createAccount}
	    ></lightning-button>
	</div>
...

Javascript file

The handleNameChange function captures the user input and updates the name input.

The createRecordadapter allows creating a record, this adapter is asynchronous. The record contains data for the fields in the record layout as stated in the official documentation.

Looking at the imports, this adapter is imported:

import { createRecord } from 'lightning/uiRecordApi';

This wire adapter uses the POST /ui-api/records resource from the UI API, which expects the RecordInput object, which has this definition:

{
  "apiName": "Account",
  "fields": {
    "Name": "Universal Containers"
		... and other fields belonging to the object specified in apiName
  }
}

The createAccount handler function is invoked when the user clicks on the button. So, to call the createRecordwire adapter you need to provide a Json variable what is done in the first few lines of the createAccount handler and named recordInput:

...
	const recordInput = { 
			apiName: ACCOUNT_OBJECT.objectApiName, 
			fields 
	};
...