Create an Account Records Using Lightning Component

Introduction:

A Lightning Component is an UserInterface framework which is used for the development of dynamic web applications which can be used in mobile Phone and our desktops. For this purpose, JavaScript is used on the client-side and Apex is used on the server-side. The Lightning Component framework is built on the open-source Aura framework. The Aura framework enables us to build apps that are not dependent on our data in Salesforce.

Follow the steps below to create an Account Records Using Salesforce Lightning Component:

Step 1: Create a Lightning Component

Firstly we have to create a Lightning Component and for that go to setup->Developer console, At Developer, console Click on New to create a lightning component and use the code mentioned below:

<aura:component controller=”createAccountRecords”>
    <aura:attribute name=”createAcc” type=”Account” default=”{‘sObjectType’ : ‘Account’,’Name’ : ”,’Rating’ : ”}”/>
    <aura:attribute name=”objName” type=”String” default=”Account”/>
    <aura:attribute name=”fldName” type=”String” default=”Rating”/>
    <aura:attribute name=”ratingList” type=”List”/>
    <aura:handler name=”init” value=”{!this}” action=”{!c.doInit}”/>
    <div class=”slds-p-around_small”>
        <lightning:input type=”Text” label=”Name” value=”{!v.createAcc.Name}”/>
        <lightning:input type=”Text” label=”Account Number” value=”{!v.createAcc.AccountNumber}”/>
        <lightning:input type=”Email” name=”email2″ value=”{!v.createAcc.Email}” label=”Email ID”/>
        <lightning:input type=”Phone” label=”Phone Number” value=”{!v.createAcc.Phone}”/>
        <lightning:select label=”Rating” value=”{!v.createAcc.Rating}”>
            <option value=””>—None—</option>
            <aura:iteration items=”{!v.ratingList}” var=”ac”>
                <option value=”{!ac}”>{!ac}</option>
            </aura:iteration>
        </lightning:select>
        <lightning:button label=”Save” iconPosition=”left” variant=”brand” onclick=”{!c.doSave}”/>
        <lightning:button label=”Cancel” iconPosition=”right” variant=”destructive” onclick=”{!c.docancel}”/>
    </div>
</aura:component>

Step 2: Create a Lightning Controller for the component

Now, we have created a component, firstly we have to handle the logic at the lightning level then we can move to apex side, for that we have to create a component controller by clicking on the controller in the panel in the right side and use the code mentioned below:

({
    doInit : function(component, event, helper) {
        var action = component.get(‘c.getPickList’);
        action.setParams({
            objName : component.get(‘v.objName’),
            fldName : component.get(‘v.fldName’)
        });
        action.setCallback(this,function(result){
            var resultValue = result.getReturnValue();
            component.set(‘v.ratingList’,resultValue);
        });
        $A.enqueueAction(action);
    },
    doSave : function(component, event, helper) {
        var action = component.get(‘c.createAccount’);
        action.setParams({
            ac : component.get(‘v.createAcc’)
        });
        action.setCallback(this,function(result){
            var getAllValue = component.get(‘v.createAcc’);
            alert(JSON.stringify(getAllValue));
        });
        $A.enqueueAction(action);
    },
    docancel : function(component, event, helper) {
        component.set(‘v.createAcc’,”);
    },
})

Step 3: Create an Apex class and define the method to create the record

Now the component which we have created will call lightning controller and then the controller will invoke Method that is written in apex class for that use the code mentioned below:

public class createAccountRecords {
    @AuraEnabled
    public static List<String> getPickList(String objName,String fldName) {
        List<String> pkList = new List<String>();Map<String,Schema.SObjectType> allObj = Schema.getGlobalDescribe();
        Map<String,Schema.SObjectField> allFlds = allObj.get(objName).getDescribe().fields.getMap();
        List<Schema.PicklistEntry> pickList = allFlds.get(fldName).getDescribe().getPickListValues();
        for(Schema.PicklistEntry pk : pickList){
            pkList.add(pk.getValue());
        }
        return pkList;
    }
    @AuraEnabled
    public static Account createAccount(Account ac){
        insert ac;
        return ac;
    }
}

Step 4: Create a Lightning application which will host the component in the App

Lightning App has to created for the hosting purpose. For that Go to Developer Console->New Lightning Application and use the code mentioned below:

<aura:application extends=”force:slds” >
    <c:createAccountRecords/>
</aura:application>

Step 5: Test the Application

We have successfully created the application and it’s time to test it. Save and Click on Update Preview to view your created Application. Your page will look something like this.

Now fill in all the details mentioned and Save it. After saving, go to your org to see if the account is created or not. Hope you enjoyed this. Thank You.