Apex Code Development You need to sign in to do that
Don't have an account?
Mythili Lightning Components Basics module -Handle actions with controllers module - issue
Hi,
i am getting Challenge Not yet complete... here's what's wrong:
The campingListItem Lightning Component doesn't contain a button or its attributes are not set correctly when clicked. error.
The description of the challnege is :
Add a button to the campingListItem component that when clicked, marks the item as packed.
Add a button labeled "Packed!" that calls the packItem controller function when clicked.
The controller action marks the item attribute as packed, updates the item value provider and disables the button.
Though I get proper output, I am not able to solve this challenge. Not sure what they are expecting.
Any help is appreciated!!
i am getting Challenge Not yet complete... here's what's wrong:
The campingListItem Lightning Component doesn't contain a button or its attributes are not set correctly when clicked. error.
The description of the challnege is :
Add a button to the campingListItem component that when clicked, marks the item as packed.
Add a button labeled "Packed!" that calls the packItem controller function when clicked.
The controller action marks the item attribute as packed, updates the item value provider and disables the button.
Though I get proper output, I am not able to solve this challenge. Not sure what they are expecting.
Any help is appreciated!!
change your component with this code
campingListItem.cmp
<aura:component >
<aura:attribute name="item" type="Camping_Item__c"/>
<p> The Item is <ui:outputText value ="{!v.item}"></ui:outputText></p>
<p>Name:
<ui:outputText value="{!v.item.name}" />
</p>
<p>Quantity:
<ui:outputNumber value="{!v.item.Quantity__c}" />
</p>
<p>Price:
<ui:outputCurrency value="{!v.item.Price__c}" />
</p>
<p>Packed?:
<ui:outputCheckbox value="{!v.item.Packed__c}" />
</p>
<p><ui:button label="Packed!" press="{!c.packItem}"></ui:button>
</p>
</aura:component>
campingListItemController.js
({
packItem : function(component, event, helper) {
var a = component.get("v.item",true);
a.Packed__c = true;
component.set("v.item",a);
var btnClick = event.getSource();
btnClick.set("v.disabled",true);
}
})
and try again.
Thanks
let me inform if it work.and mark it best answer if its helps you :)
All Answers
.cmp file:
<aura:component >
<aura:attribute name="item" type="boolean"/>
<ui:outputCheckBox value="{!v.item}"/>
<ui:button press="{!c.packItem}" label="Packed!" disabled="false" aura:id="btn"/>
</aura:component>
.js file:
({
packItem : function(component, event, helper) {
component.set("v.item",true);
event.getSource().set("v.disabled",true);//Disable the button
}
})
change your component with this code
campingListItem.cmp
<aura:component >
<aura:attribute name="item" type="Camping_Item__c"/>
<p> The Item is <ui:outputText value ="{!v.item}"></ui:outputText></p>
<p>Name:
<ui:outputText value="{!v.item.name}" />
</p>
<p>Quantity:
<ui:outputNumber value="{!v.item.Quantity__c}" />
</p>
<p>Price:
<ui:outputCurrency value="{!v.item.Price__c}" />
</p>
<p>Packed?:
<ui:outputCheckbox value="{!v.item.Packed__c}" />
</p>
<p><ui:button label="Packed!" press="{!c.packItem}"></ui:button>
</p>
</aura:component>
campingListItemController.js
({
packItem : function(component, event, helper) {
var a = component.get("v.item",true);
a.Packed__c = true;
component.set("v.item",a);
var btnClick = event.getSource();
btnClick.set("v.disabled",true);
}
})
and try again.
Thanks
let me inform if it work.and mark it best answer if its helps you :)
But I get some error when I click on the button. Is this expected behaviour?
Thanks,
Mythili
I think object is passed as null in apex:attribute.
Something has gone wrong. Action failed: LightningMyth$campingListItem$controller$packItem [TypeError: Cannot set property 'Packed__c' of null] Failing descriptor: {LightningMyth$campingListItem$controller$packItem}. Please try again.
you got this error because by default Packed__c value is null not false to solve this issue update <aura:attribute> line in your component
<aura:attribute name="item" type="Camping_Item__c" default="{
'sobjectType':'Camping_Item__c',
'Packed__c':false
}"/>
Thanks :)