Component to insert multiple records

This post is about how to create a component to insert multiple records

Step 1. Functional description

Step 2. Technical description

This component can insert multiple account records in the same screen. The component includes one button.

When you click on this button, a form will be showed.

Fill the form.

Click on ‘Save’ button. The record will be saved and the form will disappear.

You can repeat the previous steps to insert more accounts.

The code is in the GitHub link on the top. The component used is:

MultipleRecordInsertionForm.cmp: form to insert multiple account records.
MultipleRecordInsertionFormController.js: MultipleRecordInsertionForm js controller
MultipleRecordInsertionFormHelper.js: MultipleRecordInsertionForm helper

MultipleRecordInsertionFormController.js methods

showTheForm(component, event, helper): change the isShowedTheForm attribute to render the form
onSubmit(component, event, helper): execute these actions when the form is submitted. The logic is in the onSubmitHelper method.
onSuccess(component, event, helper): when the record is saved, this actions are executed. The logic is in the onSuccessHelper method.

MultipleRecordInsertionFormHelper.js methods

onSubmitHelper(component, event): execute these actions when the form is submitted. It submits the fields from the form.
submitFields (component): submit the fields.
hideTheForm(component): change the isShowedTheForm attribute to hide the form.
showTheForm(component): change the isShowedTheForm attribute to render the form.
onSuccessHelper (component, event): when the record is saved , this actions are executed. It hides the the form.

Published by Ignacio Sarmiento Losada