You need to sign in to do that
Don't have an account?
sharath chandra parsi
The campingList component doesn't have a Name field using an inputText UI component.
component code:
<aura:component>
<aura:attribute name="items" type="Camping_Item__c[]" />
<aura:attribute name="newItem" type="Camping_Item__c" default="{
'sObjectType' : 'Camping_Item__c',
'Name' : '',
'Price__c' : 0 ,
'Quantity__c' : 0}"/>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:inputText aura:id="name" label="Name"
class="slds-input"
labelClass="slds-form-element__label"
value="{!v.newItem.name__c}"
required="true"/>
</div>
</div>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:inputCurrency aura:id="price" label="Price"
class="slds-input"
labelClass="slds-form-element__label"
value="{!v.newItem.Price__c}"
required="true"/>
</div>
</div>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:inputNumber aura:id="Quantity" label="Quantity"
class="slds-input"
labelClass="slds-form-element__label"
value="{!v.newItem.Quantity__c}"
required="true"/>
</div>
</div>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:button label="Add Camping Item"
class="slds-input"
labelClass="slds-form-element__label"
press="{!c.submitForm}"/>
</div>
</div>
<aura:iteration items="{!v.items}" var="item">
<c:campingListItem item="{!item}"/>
</aura:iteration>
</aura:component>
controller code:
({
submitForm : function(component, event, helper) {
var validItem = true;
if($A.utils.isEmpty(component.find("name").get("v.value"))){
validItem = false;
component.find("name").set("v.errors",[{message : "Please give a name"}]);
}
else{
component.find("name").set("v.errors" , null);
}
if($A.utils.isEmpty(component.find("price").get("v.value"))){
validItem = false;
component.find("price").set("v.errors",[{message : "Please give a price"}]);
}
else{
component.find("price").set("v.errors" , null);
}
if($A.utils.isEmpty(component.find("Quantity").get("v.value"))){
validItem = false;
component.find("Quantity").set("v.errors",[{message : "Please give a Quantity"}]);
}
else{
component.find("Quantity").set("v.errors" , null);
}
if(validItem){
var item = component.get("v.newItem");
helper.createItem(component , item);
}
}
})
Helper code:
({
createItem : function(component , newItem) {
var items = component.get("v.items");
items.push(newItem);
component.set("v.items" , items);
}
})
<aura:component>
<aura:attribute name="items" type="Camping_Item__c[]" />
<aura:attribute name="newItem" type="Camping_Item__c" default="{
'sObjectType' : 'Camping_Item__c',
'Name' : '',
'Price__c' : 0 ,
'Quantity__c' : 0}"/>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:inputText aura:id="name" label="Name"
class="slds-input"
labelClass="slds-form-element__label"
value="{!v.newItem.name__c}"
required="true"/>
</div>
</div>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:inputCurrency aura:id="price" label="Price"
class="slds-input"
labelClass="slds-form-element__label"
value="{!v.newItem.Price__c}"
required="true"/>
</div>
</div>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:inputNumber aura:id="Quantity" label="Quantity"
class="slds-input"
labelClass="slds-form-element__label"
value="{!v.newItem.Quantity__c}"
required="true"/>
</div>
</div>
<div class="slds-form-element slds-is-required">
<div class="slds-form-element__control">
<ui:button label="Add Camping Item"
class="slds-input"
labelClass="slds-form-element__label"
press="{!c.submitForm}"/>
</div>
</div>
<aura:iteration items="{!v.items}" var="item">
<c:campingListItem item="{!item}"/>
</aura:iteration>
</aura:component>
controller code:
({
submitForm : function(component, event, helper) {
var validItem = true;
if($A.utils.isEmpty(component.find("name").get("v.value"))){
validItem = false;
component.find("name").set("v.errors",[{message : "Please give a name"}]);
}
else{
component.find("name").set("v.errors" , null);
}
if($A.utils.isEmpty(component.find("price").get("v.value"))){
validItem = false;
component.find("price").set("v.errors",[{message : "Please give a price"}]);
}
else{
component.find("price").set("v.errors" , null);
}
if($A.utils.isEmpty(component.find("Quantity").get("v.value"))){
validItem = false;
component.find("Quantity").set("v.errors",[{message : "Please give a Quantity"}]);
}
else{
component.find("Quantity").set("v.errors" , null);
}
if(validItem){
var item = component.get("v.newItem");
helper.createItem(component , item);
}
}
})
Helper code:
({
createItem : function(component , newItem) {
var items = component.get("v.items");
items.push(newItem);
component.set("v.items" , items);
}
})
"Name" is a built-in field so you don't need suffix "__c". And codes in lightning are case-sensitive as piyush_soni says.
Try below!
All Answers
use
value="{!v.newItem.Name__c}"
not
value="{!v.newItem.name__c}"name__c and Name__c both are different in lightning component
thanks
let me inform if it helps you and mark it best answer so it make proper solution for others
sfdcmonkey.com
"Name" is a built-in field so you don't need suffix "__c". And codes in lightning are case-sensitive as piyush_soni says.
Try below!