You need to sign in to do that
Don't have an account?
Saroj Kushwaha
Display a single item for your packing list
hiii,
I m new to Salesforce. My challenge was
Create a Lightning Component to display a single item for your packing list.
After lots of experimentation I found some good results. The result is I can display all the Camping list items with the following code. But my challenge is not yet complete. It is saying....
"Challenge Not yet complete... here's what's wrong:
The campingListItem Lightning Component's attribute tag doesn't exist or its attributes are not set correctly."
campingArrayIteration.cmp
<aura:component controller="CampingListClass" >
<h2>Camping List Items</h2>
<aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
<aura:attribute name="campingArray" type="Camping_Item__c[]"/>
<aura:iteration items="{!v.campingArray}" var="iterationVar">
<div>
<c:campingItem item="{!iterationVar}"/>
</div>
</aura:iteration>
</aura:component>
campingArrayIterationController.js
({
doInit: function(component, event, helper) {
var action = component.get("c.getCampingItems");
action.setCallback(this, function(response) {
var state = response.getState();
if (component.isValid() && state === "SUCCESS") {
component.set("v.campingArray", response.getReturnValue());
}
else { console.log("Failed with state: " + state); }
});
$A.enqueueAction(action);
}
})
campingListIteration.cmp
<aura:component >
<aura:attribute name="item" type="Camping_Item__c" />
<div><br/>
<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}" aura:id="opCB" /></p>
</div>
</aura:component>
CampingListClass.apxc
public with sharing class CampingListClass {
@AuraEnabled
public static List<Camping_Item__c> getCampingItems() {
return [SELECT Id, Name, Quantity__c, Price__c, Packed__c,
CreatedDate
FROM Camping_Item__c];
}
}
this is the result coming with proper checkboxes
Camping List Items
Name:Boys Track Suite
Quantity:15
Price:$1,500.00
Packed?:
Name:Girls Track Suite
Quantity:13
Price:$1,400.00
Packed?:
Name:NCC Boys suite
Quantity:13
Price:$1,900.00
Packed?:
Name:NCC girls suite
Quantity:18
Price:$2,100.00
Packed?:
Can anyone help me in displaying only a single record, i tried a lot but it is not coming, so that i can complete my challenge.
Thanks
Saroj
I m new to Salesforce. My challenge was
Create a Lightning Component to display a single item for your packing list.
- Create a compenent called campingListItem.
- Add an attribute named item for type Camping_Item__c that is required.
- Display the Name, Price, Quanity and Packed status using the appropriate output fields.
After lots of experimentation I found some good results. The result is I can display all the Camping list items with the following code. But my challenge is not yet complete. It is saying....
"Challenge Not yet complete... here's what's wrong:
The campingListItem Lightning Component's attribute tag doesn't exist or its attributes are not set correctly."
campingArrayIteration.cmp
<aura:component controller="CampingListClass" >
<h2>Camping List Items</h2>
<aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
<aura:attribute name="campingArray" type="Camping_Item__c[]"/>
<aura:iteration items="{!v.campingArray}" var="iterationVar">
<div>
<c:campingItem item="{!iterationVar}"/>
</div>
</aura:iteration>
</aura:component>
campingArrayIterationController.js
({
doInit: function(component, event, helper) {
var action = component.get("c.getCampingItems");
action.setCallback(this, function(response) {
var state = response.getState();
if (component.isValid() && state === "SUCCESS") {
component.set("v.campingArray", response.getReturnValue());
}
else { console.log("Failed with state: " + state); }
});
$A.enqueueAction(action);
}
})
campingListIteration.cmp
<aura:component >
<aura:attribute name="item" type="Camping_Item__c" />
<div><br/>
<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}" aura:id="opCB" /></p>
</div>
</aura:component>
CampingListClass.apxc
public with sharing class CampingListClass {
@AuraEnabled
public static List<Camping_Item__c> getCampingItems() {
return [SELECT Id, Name, Quantity__c, Price__c, Packed__c,
CreatedDate
FROM Camping_Item__c];
}
}
this is the result coming with proper checkboxes
Camping List Items
Name:Boys Track Suite
Quantity:15
Price:$1,500.00
Packed?:
Name:Girls Track Suite
Quantity:13
Price:$1,400.00
Packed?:
Name:NCC Boys suite
Quantity:13
Price:$1,900.00
Packed?:
Name:NCC girls suite
Quantity:18
Price:$2,100.00
Packed?:
Can anyone help me in displaying only a single record, i tried a lot but it is not coming, so that i can complete my challenge.
Thanks
Saroj
All Answers