You need to sign in to do that
Don't have an account?
Mokshada
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
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
I have modified the code a little. Can you check with below. There is no change in Aura Controller.
Aura component:
Helper:
Apex Controller:
Let me know if you face any issues.
If this solution helps, Please mark it as best answer.
Thanks,
All Answers
Do you mean you want only contact to be created but here both Account and Contact are getting created?
Thanks,
yes I want to create only related contact to that account.
Thanks,
Mokshada
Can you confirm how to relate the contact with Account. Are you putting this component on Account Detail page?
Thanks,
I am not sure can you please confirm how can we do that.
Thanks,
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,
I have modified the code a little. Can you check with below. There is no change in Aura Controller.
Aura component:
Helper:
Apex Controller:
Let me know if you face any issues.
If this solution helps, Please mark it as best answer.
Thanks,
It is creating only contact not related contact to perticular account, right?
Thanks,
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,
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
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,
Okay Thank you..!