Lightning:RecordForm is a powerful component which is part of Lightning data service. There are many new things coming in lightning that’s make us to try our hand on all of them. Previously if we need to create Edit or detail page we need to manually create them. Either we need to use custom code or we can use Lightning:recordEditForm or LightningDataService.
But now we have Lightning:RecordForm, which enables us to quickly create forms to add, view, or update a record. Using this component, it is few lines to create record forms than building forms manually with lightning:recordEditForm and lightning:recordViewForm. Using a single line of code we can create full page layout. And we don’t need to worry about layout changes as it take care of them.
<lightning:recordForm recordId="001XXXXXX" objectApiName="Account" layoutType="Full" mode="view" />
But what if we need to add some custom validation before creating record. If we need to update some fields before saving the record then we can also customize this as well. Today we will take an example where we will use onsubmit to save the record. And After save we will redirect to record detail page.
This is how our flow will run.
Sample Code
So here we are updating an existing record. We can remove the recordId if we want to create a new record. So once user click on save button it fires the onsubmit event. So in this event first we stop the standard execution and then we pass this data to apex. Finally in Apex we are creating the actual record and returing the record Id. Now using the navigation method we redirect to record detail page. So don’t forget to stop the standard flow else it will create two records for you.
As this component is generic so you can use it with any object to quickly get the edit page or new record screen.
We also have lightning-record-form which is an upgrade version in Lightning Web Components.
Did you want to add anything or have any question, please let me know in comments section. Happy programming 🙂
Is this code working for you because in your Apex code you have taken map and while putting value in that map, for each field of data type other than String it will give error “Illegal Assignment from String to Date” (for example).
Thanks Abhishek. I have updated that part. But we need to handle the DateTime part. it will be different for different orgs. Current code is working in my org.
Thanks for the info Tushar. I have a question on whether we can group set of fields as sections using lightning:recordForm?
As we are giving layoutType here so section made in layout should come here. I’m checking it in detail and will update if I found anything useful.
Can we update the record details using this code.??
Yes we can. In the sample I am updating record.
Hi Tushar, Can we create a dependent layout using this.
Example:
1. If a picklist value= A
Then only section A has to be shown
1. If a picklist value= B
Then only section B has to be shown
If you already have dependent picklist on standard page then you can view them here
Hi Tushar, can we make fields required like we can in page layouts
I don’t think its possible.
Alright thanks, how can we apply custom css like an asterisk on fields
I don’t think thats possible here. You can hardcode class name but I don’t think that will work.
Searching for lightning “createRecords” brought me here, but unfortunately this only saves one record 🙁
Looking for a bulk implementation of lightning/uiRecordApi’s “createRecord” method