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
Kimm DyKimm Dy 

TrailHead - CampingListItem Error

Hello, 
 

I'm still learning lightning and have rewritten my controller but I seem to be missing something since I'm getting the error " The campingListItem Lightning Component doesn't contain a Lightning button with the correct label or it does not call the correct function when clicked." I'm not sure what I'm missing. Any feedback is appreciated. 

My component: 
 

<aura:component implements="flexipage:availableForAllPageTypes" access="global">
   	<aura:attribute name="item" type="Camping_Item__c" required="true" 
                    default="{Name:'Xphone', Price__c: '100', Quantity__c:'1',Packed__c:false}"/>
    <aura:attribute name="disabled" type="Boolean" default="false"/>
    
    <p>Name:{!v.item.Name}</p>
    <p>Packed:{!v.item.Packed__c}</p>
    <p>Price: <lightning:formattedNumber value="{!v.item.Price__c }" style="currency"/></p>
    <p>Quantity:<lightning:formattedNumber value="{!v.item.Quantity__c}"/></p>
    <!--<p><lightning:input type="toggle"
                        label="Packed"
                        name="packedvalue"
                        checked="{!v.item.Packed__c}"/>
    </p>-->
    <div><lightning:button label="Packed!" 
                      	onclick="{!c.packedItem}"
                           disabled="{!v.disabled}"/> 
    </div>	
       
</aura:component>
 
({
    packItem: function(component, event, helper)
    {	var btnClicked = event.getSource(); 
        var item = btnClicked.get("v.item"); 
        item.Packed__c = true;
        component.set("v.item", item);
        component.set("v.disabled", true)
    },
})
Best Answer chosen by Kimm Dy
Faiz Ali 19Faiz Ali 19
Hi Kimm Dy,

As the error suggests that  "The campingListItem Lightning Component doesn't contain a Lightning button with the correct label" OR "it does not call the correct function when clicked" going by your code it rules out the former so we are left with the latter option which turns out to be true. In your code you have called "{!c.packedItem}" whereas you have declared a function called packItem in your controller. Kindly change -

  <div><lightning:button label="Packed!"   onclick="{!c.packedItem}"   disabled="{!v.disabled}"/> </div>   
to

 <div><lightning:button label="Packed!"   onclick="{!c.packItem}"   disabled="{!v.disabled}"/> </div>

Cheers!!
Faiz

All Answers

Faiz Ali 19Faiz Ali 19
Hi Kimm Dy,

As the error suggests that  "The campingListItem Lightning Component doesn't contain a Lightning button with the correct label" OR "it does not call the correct function when clicked" going by your code it rules out the former so we are left with the latter option which turns out to be true. In your code you have called "{!c.packedItem}" whereas you have declared a function called packItem in your controller. Kindly change -

  <div><lightning:button label="Packed!"   onclick="{!c.packedItem}"   disabled="{!v.disabled}"/> </div>   
to

 <div><lightning:button label="Packed!"   onclick="{!c.packItem}"   disabled="{!v.disabled}"/> </div>

Cheers!!
Faiz
This was selected as the best answer
Kimm DyKimm Dy
Hi Faiz,

You are right! Thank you so much for pointing this out. I completely missed the "ed" part. 

Thanks again! :)
Kim