Create Records Using Lightning Components

In this post, we will focus on how to create records of any SObject Type(SObject can be Standard and Custom) using Lightning Component.
Lightning Component:
<aura:component controller="CreateAnAccount"
                implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,
                            force:hasRecordId,forceCommunity:availableForAllPageTypes"
                access="global" >
 
    <ltng:require styles="/resource/bootstrap/css/bootstrap.min.css"
                  scripts="/resource/bootstrap/js/jquery.js,/resource/bootstrap/js/bootstrap.min.js"/>
    <aura:attribute name="account" type="Account" default="{'sobjectType': 'Account',
                                                           'Name': '',
                                                           'AccountNumber': '',
                                                           'AnnualRevenue': '',
                                                           'AUM__c': ''
                                                           }"/>
       <lightning:card iconName="standard:account" title="{!v.account.Name}" >
        <div class="slds-form slds-form_compound">
            <fieldset class="slds-form-element">
                <div class="slds-form-element__group">
                    <div class="slds-form-element__row">
                        <div class="slds-form-element slds-size_1-of-2">
                            <label>Name</label>
                            <ui:inputText class="form-control" value="{!v.account.Name}"/>
                        </div>
                        <div class="slds-form-element slds-size_1-of-2">
                            <label>Account Number</label>
                            <ui:inputText class="form-control" value="{!v.account.AccountNumber}"/>
                        </div>
                    </div>
                </div>
            </fieldset>
            <fieldset class="slds-form-element">
                <div class="slds-form-element__group">
                    <div class="slds-form-element__row">
                        <div class="slds-form-element slds-size_1-of-2">
                            <label>Annual Revenue</label>
                            <ui:inputText class="form-control" value="{!v.account.AnnualRevenue}"/>
                        </div>
                        <div class="slds-form-element slds-size_1-of-2">
                            <label>AUM</label>
                            <ui:inputText class="form-control" value="{!v.account.AUM__c}"/>
                        </div>
                    </div>
                </div>
            </fieldset>
         
            <div class="col-md-4 text-center">
                <ui:button class="btn btn-default" press="{!c.create}">Create</ui:button>
            </div>
        </div>
    </lightning:card>
    </aura:component>
Controller:
({
    create : function(component, event, helper) {
        var account = component.get("v.account");
        if($A.util.isEmpty(account.Name) || $A.util.isUndefined(account.Name)){
            alert('Name is Required');
            return;
        }           
        if($A.util.isEmpty(account.AccountNumber) || $A.util.isUndefined(account.AccountNumber)){
            alert('Account Number is Rqquired');
            return;
        }
        if($A.util.isEmpty(account.AnnualRevenue) || $A.util.isUndefined(account.AnnualRevenue)){
            alert('Annual Revenue is Required');
            return;
        }
        if($A.util.isEmpty(account.AUM__c) || $A.util.isUndefined(account.AUM__c)){
            alert('AUM is Required');
            return;
        }
        var action = component.get("c.createRecord");
        action.setParams({
            account : account
        });
       
        action.setCallback(this,function(a){
            var state = a.getState();
            if(state == "SUCCESS"){
                var newCandidate = {'sobjectType': 'Account',
                                    'Name': '',
                                    'AccountNumber': '',
                                    'AnnualRevenue': '',
                                    'AUM__c': ''
                                   };
                component.set("v.account",newCandidate);
                alert('Record is Created Successfully');
            } else if(state == "ERROR"){
                alert('Error in calling server side action');
            }
        });
        $A.enqueueAction(action);
    }
})

Apex Controller:
public class CreateAnAccount {
@AuraEnabled
    public static void createRecord (Account account){
        try{
            System.debug('CreateAnAccount::createRecord::candidate'+account);
            if(account != null){
                insert account;
            }
        } catch (Exception ex){
         
        }
    } 

}
OutCome:
If you click on CREATE button a New Record will be created on that particular SObject like below,





Comments

Popular posts from this blog

Configur Docusign For Salesforce

How To Make DataTable Column Resizable

Lightning:recordForm - Lightning Data Service