+ Start a Discussion
NLakshmanNLakshman 

Option to select the record type while creating the new contact through lightning component

Hi All,

I had requirement to create 'New Contact' from lightning component on clicking the button on other lightning component, for this created the new  'CreateContact' lightning component as code shown below and screen and included that on other lightning component.

Can someone help me with code to select the record type while creating the new contact using lightning component? As of now i have defaulted the record type.

Component:

<aura:component >
    <aura:attribute name="myContactFields" type="List" default="['AccountId','LastName', 'FirstName']" />
    <aura:registerEvent name="CmpEvent" type="c:SHM_CreateContactModelClose" />
    <aura:attribute name="recordTypes" type="list" default="Business,Individual"/>
    <lightning:messages />
    <lightning:recordForm
                          aura:id ="createContactForm"
                          objectApiName="Contact"
                          layoutType="Full"
                          columns="2"
                          mode="edit"
                          recordTypeId="0120k000000HOHkAAO"
                          onsubmit="{!c.handleSubmit}"                  
                          onsuccess="{!c.handleSuccess}"
                          oncancel="{!c.handleCancel}" />
</aura:component>

JS Controller:

({
    handleSuccess : function(component, event, helper) {
        var toastEvent = $A.get("e.force:showToast");
        toastEvent.setParams({
            "title": "Success!",
            "type":"success",
            "message": 'Contact Record has been created Successfully!!..'
        });
        toastEvent.fire();
        $A.get('e.force:refreshView').fire();
    },
    handleSubmit : function(component, event, helper) {
        //event.preventDefault(); // Prevent default submit
        
        component.find('createContactForm').submit(); // Submit form
        console.log('Successfully Created Contact Record');
    },
   
    handleCancel : function(component, event, helper) {
        var cmpEvent = component.getEvent("CmpEvent");
        cmpEvent.setParams({
            "closeModel" : false
        });
        cmpEvent.fire();
    },
})

Create Contact Pop Up

Thanks in Advance.
Khan AnasKhan Anas (Salesforce Developers) 
Hi,

Greetings to you!

You need to create custom record type selection in your lightning component. recordTypeId is optional and, if provided, specifies the record type for the created object. According to Salesforce doc (https://developer.salesforce.com/docs/component-library/bundle/lightning:recordForm/documentation):

You must provide a record type ID using the recordTypeId attribute if you have multiple record types on an object and you don't have a default record type. Otherwise, the default record type ID is used.

There's an idea which is active on the success community with a similar discussion for which you can upvote so that it gets available in the future.

https://success.salesforce.com/ideaView?id=0873A000000CR9sQAG

Please refer to the below links which might help you further with the above requirement.

http://sfdcmonkey.com/2017/05/09/custom-record-type-selection-lightning-component/

https://salesforce.stackexchange.com/questions/216135/getting-recordtypeid-selected-from-record-type-selection-page-in-a-lightning

I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in the future. It will help to keep this community clean.

Thanks and Regards,
Khan Anas
Zuzana RosZuzana Ros
Hi TNL,

here's what you need to do.

1. - get contact's record types info from apex on component init and save it to component's attribute

Apex
@AuraEnabled
public static List<Map<String, String>> getContactRTs(){
    Schema.DescribeSObjectResult R = Contact.SObjectType.getDescribe();
    List<Schema.RecordTypeInfo> RT = R.getRecordTypeInfos();
    List<Map<String, String>> rtInfo = new List<Map<String, String>>();
    for(Schema.RecordTypeInfo rti : RT){
        if(rti.isActive()){
            rtInfo.add(new Map<String, String>{'value' => rti.getRecordTypeId(), 'label' => rti.getName()});
        }   
    }
return rtInfo;
}

Controller
doInit: function(component, event, helper) {
        var action = component.get("c.getContactRTs");
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                component.set("v.recordTypes", response.getReturnValue());
            }
            else {
                console.log("Failed with state: " + state);
            }
        });
        $A.enqueueAction(action);
},


Component
<aura:component controller="Controller">
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
     
    <aura:attribute name="recordTypes" type="List" />
    <aura:attribute name="selectedRecordType" type="String"/>
    <aura:attribute name="isRecordTypeSelectionVisible" type="Boolean" default="true"/>
</aura:component>




2. Add Record Type Selection for user prior contact creation, you can use for example Lightning:radioGroup
<lightning:radioGroup name="recordTypes"
                              label="Select Record Type"
                              options="{! v.recordTypes }"
                              onchange="{! c.handleChange }"
                              type="radio"/>




3. Switch the view form Record Type Selection to Contact Record Creation, you can use modal windiw or just aura:if and handle User radioGroup onchange action to set the selected record type id to your Lightning:recordForm component

Component
<aura:if isTrue="{!v.isRecordTypeSelectionVisible}">
       <lightning:radioGroup name="recordTypes"
                             label="Select Record Type"
                             options="{! v.recordTypes }"
                             onchange="{! c.handleChange }"
                             type="radio"/>
         
       <aura:set attribute="else">
           <lightning:recordForm
                         aura:id ="createContactForm"
                         objectApiName="Contact"
                         layoutType="Full"
                         columns="2"
                         mode="edit"
                         recordTypeId="{!v.selectedRecordType}"
                         onsubmit="{!c.handleSubmit}"                 
                         onsuccess="{!c.handleSuccess}"
                         oncancel="{!c.handleCancel}" />
       </aura:set>
</aura:if>


Controller
handleChange: function(component, event, helper){
        component.set("v.selectedRecordType", event.getParam("value"));
        //switch to Lightning:recordForm view       
        component.set("v.isRecordTypeSelectionVisible", false);
}

Please, let me know it this solve your problem.

Cheers

Zuzana