function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
MokshadaMokshada 

How to create aura component for we need to enter firstname lastname and email and one contact should be created related to that account

How to create aura component for we need to enter firstname lastname and email and one contact should be created related to that account. 
I have tried like this but new account and contact is also getting created.
apex:-
public class contactRegistrationController {
@AuraEnabled
    public static Contact saveContact(Contact Contact) {
        account acc=new account();
        acc.Name=contact.FirstName +' ' +contact.LastName;
        insert acc;
        Contact.AccountId=acc.Id;
        upsert Contact;
        return Contact;
    }
}


component:-
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global"  controller="contactRegistrationController" >
    <aura:attribute name="contacts" type="Contact[]"/>
    <aura:attribute name="accounts" type="Account[]"/> 
    <aura:attribute name="newContact" type="Contact"
                    default="{ 'sobjectType': 'Contact',
                             'FirstName': '',
                             'LastName': '',
                             'Email': '',
                             'Phone': '','MailingStreet':'','MailingCity':'','MailingState':'','Zip':'','MailingCountry':'',
                             'Password__c': '' }"/>
    <div class="slds-page-header" role="banner">
        <div class="slds-grid">
            <div class="slds-col">
                <p class="slds-text-heading--label">Contact</p>
                <h1 class="slds-text-heading--medium">My Contact</h1>
            </div>
        </div>
    </div>
    <div class="slds-col slds-col--padded slds-p-top--large">
        <div aria-labelledby="newcontactform">
            <fieldset class="slds-box slds-theme--default slds-container--small">
                <legend id="newexpenseform" class="slds-text-heading--small 
                                                   slds-p-vertical--medium">
                    Add Contact
                </legend>
                <form class="slds-form--stacked">
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="fstname" label="First Name"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.FirstName}"
                                          required="true"/>
                        </div></div>
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="lstname" label="Last Name"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.LastName}"
                                          required="true"/>
                        </div>
                    </div>
                    
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="email" label="Email"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.Email}"
                                          required="true"/>
                        </div>
                    </div>
                    
                    <div class="slds-form-element">
                        <ui:button label="Submit"
                                   class="slds-button slds-button--brand"
                                   press="{!c.clickCreateContact}"/>
                    </div>
                </form>
            </fieldset>
        </div>
    </div>
</aura:component>

controller:-
({
    clickCreateContact: function(component, event, helper) {
        console.log('inside click create contact');
        var validExpense = true;
        var firstnameField = component.find("fstname");
        var frtname = firstnameField.get("v.value");
        
        if ($A.util.isEmpty(frtname)){
            validExpense = false;
            firstnameField.set("v.errors", [{message:"First name can't be blank."}]);
        }
        else {
            firstnameField.set("v.errors", null);
        }
        
        var lastnameField = component.find("lstname");
        var larname = lastnameField.get("v.value");
        if ($A.util.isEmpty(larname)){
            validExpense = false;
            lastnameField.set("v.errors", [{message:"Last Name can't be blank."}]);
        }
        else {
            lastnameField.set("v.errors", null);
        }
        
       if(validExpense){
            var newContact = component.get("v.newContact");
            //var newAccount = component.get("v.newAccount");
            console.log("Create Contact: " + JSON.stringify(newContact));
           // console.log("Create Account: " + JSON.stringify(newAccount));

           //helper.createAccount(component, newAccount);
           helper.createContact(component, newContact);
           
       }
    },
})

Helper:-
({
   
    createContact: function(component, contact) {
        console.log('inside helper');
        
    var action = component.get("c.saveContact");
        console.log('after method called ');
    action.setParams({
        "Contact": contact
        //component.get("v.contacts")
         
    });
    action.setCallback(this, function(response){
        var state = response.getState();
        if (component.isValid() && state === "SUCCESS") {
            var contacts = component.get("v.contacts");
            contacts.push(response.getReturnValue());
            component.set("v.contacts", contacts);
            alert('contact inserted successfully');
             
        }
    });
    $A.enqueueAction(action);
},
    
})


can anyone help how can I achieve this.
Thanks,
Mokshada
Best Answer chosen by Mokshada
Sai PraveenSai Praveen (Salesforce Developers) 
Hi Mokshada,

I have modified the code a little. Can you check with below. There is no change in Aura Controller.

Aura component:
<aura:component implements="force:appHostable,force:hasRecordId,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global"  controller="contactRegistrationController" >
    <aura:attribute name="contacts" type="Contact[]"/>
    <aura:attribute name="accounts" type="Account[]"/> 
    <aura:attribute name="newContact" type="Contact"
                    default="{ 'sobjectType': 'Contact',
                             'FirstName': '',
                             'LastName': '',
                             'Email': '',
                             'Phone': '','MailingStreet':'','MailingCity':'','MailingState':'','Zip':'','MailingCountry':'',
                             'Password__c': '' }"/>
    <div class="slds-page-header" role="banner">
        <div class="slds-grid">
            <div class="slds-col">
                <p class="slds-text-heading--label">Contact</p>
                <h1 class="slds-text-heading--medium">My Contact</h1>
            </div>
        </div>
    </div>
    <div class="slds-col slds-col--padded slds-p-top--large">
        <div aria-labelledby="newcontactform">
            <fieldset class="slds-box slds-theme--default slds-container--small">
                <legend id="newexpenseform" class="slds-text-heading--small 
                                                   slds-p-vertical--medium">
                    Add Contact
                </legend>
                <form class="slds-form--stacked">
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="fstname" label="First Name"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.FirstName}"
                                          required="true"/>
                        </div></div>
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="lstname" label="Last Name"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.LastName}"
                                          required="true"/>
                        </div>
                    </div>
                    
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="email" label="Email"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.Email}"
                                          required="true"/>
                        </div>
                    </div>
                    
                    <div class="slds-form-element">
                        <ui:button label="Submit"
                                   class="slds-button slds-button--brand"
                                   press="{!c.clickCreateContact}"/>
                    </div>
                </form>
            </fieldset>
        </div>
    </div>
</aura:component>

Helper:
 
({
   
    createContact: function(component, contact) {
        console.log('inside helper');
                    var recordId = component.get('v.recordId');

    var action = component.get("c.saveContact");
        console.log('after method called ');
    action.setParams({
        "Contact": contact,
        "accountid":recordId
        //component.get("v.contacts")
         
    });
    action.setCallback(this, function(response){
        var state = response.getState();
        if (component.isValid() && state === "SUCCESS") {
            var contacts = component.get("v.contacts");
            contacts.push(response.getReturnValue());
            component.set("v.contacts", contacts);
            alert('contact inserted successfully');
             
        }
    });
    $A.enqueueAction(action);
},
    
})

Apex Controller:
 
public class contactRegistrationController {
@AuraEnabled
    public static Contact saveContact(Contact Contact, Id accountid) {

        Contact.AccountId=accountid;
        upsert Contact;
        return Contact;
    }
}

Let me know if you face any issues.

If this solution helps, Please mark it as best answer.

Thanks,
​​​​​​​​​​​​​​

All Answers

Sai PraveenSai Praveen (Salesforce Developers) 
Hi Mokshada,

Do you mean you want only contact to be created but here both Account and Contact are getting created?

Thanks,
MokshadaMokshada
Hi Praveen,
yes I want to create only related contact to that account.

Thanks,
Mokshada 
Sai PraveenSai Praveen (Salesforce Developers) 
Hi Mokshada,

Can you confirm how to relate the contact with Account. Are you putting this component on Account Detail page?

Thanks,
 
MokshadaMokshada
Yes on account detail page. I think we should get account I'd in component then we will create related contact.
I am not sure can you please confirm how can we do that.

Thanks,
Mokshada
Sai PraveenSai Praveen (Salesforce Developers) 
Hi Mokshada,

We can use hasRecordid in this scenerio and get that to apex controller. I will try the code implementation and get back to you with the solution.

Thanks,
 
MokshadaMokshada
Ok Thank you,
Sai PraveenSai Praveen (Salesforce Developers) 
Hi Mokshada,

I have modified the code a little. Can you check with below. There is no change in Aura Controller.

Aura component:
<aura:component implements="force:appHostable,force:hasRecordId,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global"  controller="contactRegistrationController" >
    <aura:attribute name="contacts" type="Contact[]"/>
    <aura:attribute name="accounts" type="Account[]"/> 
    <aura:attribute name="newContact" type="Contact"
                    default="{ 'sobjectType': 'Contact',
                             'FirstName': '',
                             'LastName': '',
                             'Email': '',
                             'Phone': '','MailingStreet':'','MailingCity':'','MailingState':'','Zip':'','MailingCountry':'',
                             'Password__c': '' }"/>
    <div class="slds-page-header" role="banner">
        <div class="slds-grid">
            <div class="slds-col">
                <p class="slds-text-heading--label">Contact</p>
                <h1 class="slds-text-heading--medium">My Contact</h1>
            </div>
        </div>
    </div>
    <div class="slds-col slds-col--padded slds-p-top--large">
        <div aria-labelledby="newcontactform">
            <fieldset class="slds-box slds-theme--default slds-container--small">
                <legend id="newexpenseform" class="slds-text-heading--small 
                                                   slds-p-vertical--medium">
                    Add Contact
                </legend>
                <form class="slds-form--stacked">
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="fstname" label="First Name"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.FirstName}"
                                          required="true"/>
                        </div></div>
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="lstname" label="Last Name"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.LastName}"
                                          required="true"/>
                        </div>
                    </div>
                    
                    <div class="slds-form-element slds-is-required">
                        <div class="slds-form-element__control">
                            <ui:inputText aura:id="email" label="Email"
                                          class="slds-input"
                                          labelClass="slds-form-element__label"
                                          value="{!v.newContact.Email}"
                                          required="true"/>
                        </div>
                    </div>
                    
                    <div class="slds-form-element">
                        <ui:button label="Submit"
                                   class="slds-button slds-button--brand"
                                   press="{!c.clickCreateContact}"/>
                    </div>
                </form>
            </fieldset>
        </div>
    </div>
</aura:component>

Helper:
 
({
   
    createContact: function(component, contact) {
        console.log('inside helper');
                    var recordId = component.get('v.recordId');

    var action = component.get("c.saveContact");
        console.log('after method called ');
    action.setParams({
        "Contact": contact,
        "accountid":recordId
        //component.get("v.contacts")
         
    });
    action.setCallback(this, function(response){
        var state = response.getState();
        if (component.isValid() && state === "SUCCESS") {
            var contacts = component.get("v.contacts");
            contacts.push(response.getReturnValue());
            component.set("v.contacts", contacts);
            alert('contact inserted successfully');
             
        }
    });
    $A.enqueueAction(action);
},
    
})

Apex Controller:
 
public class contactRegistrationController {
@AuraEnabled
    public static Contact saveContact(Contact Contact, Id accountid) {

        Contact.AccountId=accountid;
        upsert Contact;
        return Contact;
    }
}

Let me know if you face any issues.

If this solution helps, Please mark it as best answer.

Thanks,
​​​​​​​​​​​​​​
This was selected as the best answer
MokshadaMokshada
Hi praveen ,
It is creating only contact not related contact to perticular account, right?
User-added image

Thanks,
Mokshada
Sai PraveenSai Praveen (Salesforce Developers) 
Hi Mokshada,

Did you copy all the code which I shared. Because it should create contact related to the account where this component is placed. Did you place the component on Account detailed page.

It was working fine in my org.

Thanks,
 
MokshadaMokshada
Hi Praveen ,
Yes it is working fine after placing the component on Account detailed page.
I was trying running it through lightning app but didn;t worked.
<aura:application Extends="force:slds" >
    <c:createcontactfform/>    
</aura:application> 
like this.
can you please tell why? and what do I need to do for that?

Thanks,
Mokshada
Sai PraveenSai Praveen (Salesforce Developers) 
Hi,

Yes this will not work if you are previewing from Lightning App as system does not know which Account Id it should consider. It will only take AccountId which we put the component on .
 

If the above solution helps, Please mark it as best answer.

 

Thanks,


 
MokshadaMokshada
Hi ,
Okay Thank you..!