Hi,

I can't pass the challenge (https://developer.salesforce.com/trailhead/force_com_dev_intermediate/lex_dev_lc_basics/lex_dev_lc_basics_events). This is the error when check challenge:

Challenge Not yet complete... here's what's wrong: 
The campingList JavaScript controller isn't adding the new record to the 'items' value provider.

I tryed in the browser add new Camping Items and it's working correctly. The item is added to database and the list is updated.

This is my code:

campingList Component

<aura:component controller="CampingListController">
    
    <aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
    <aura:handler name="addItem" event="c:addItemEvent" action="{!c.handleAddItem}"/>
    
    <div class="slds-page-header" role="banner">

      <div class="slds-grid">

        <div class="slds-col">

          <p class="slds-text-heading--label">Camping Items</p>

          <h1 class="slds-text-heading--medium">My Camping Items</h1>

        </div>

      </div>

    </div>

      
  <div aria-labelledby="newitemform">

      <fieldset class="slds-box slds-theme--default slds-container--small">
    
        <c:campingListForm />
    
      </fieldset>

	</div>
    
    
     <aura:attribute name="items" type="Camping_Item__c[]"/>

    <div class="slds-card slds-p-top--medium">
        <header class="slds-card__header">
            <h3 class="slds-text-heading--small">Camping List Items</h3>
        </header>
        
        <section class="slds-card__body">
            <div id="list" class="row">
                <aura:iteration items="{!v.items}" var="campItem">
                    <c:campingListItem item="{!campItem}"/>
                </aura:iteration>
            </div>
        </section>
    </div>

</aura:component>

campingList Controller.js

({
    
    doInit: function(component, event, helper) {
    
        var action = component.get("c.getItems");
    
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (component.isValid() && state === "SUCCESS") {
                component.set("v.items", response.getReturnValue());
            }
            else {
                console.log("Failed with state: " + state);
            }
        });
    
        $A.enqueueAction(action);
    },    
    
    handleAddItem: function(component, event, helper) {
        var item = event.getParam("item");
                
        var action = component.get("c.saveItem");
        action.setParams({
            "item": item
        });
        
        action.setCallback(this, function(response){
            var state = response.getState();
            if (component.isValid() && state === "SUCCESS") {        
                var theItems = component.get("v.items");
                theItems.push(item);
                component.set("v.items",theItems);
            }
        });
        $A.enqueueAction(action);
    }
    
})

CampingListController

public with sharing class CampingListController {

    @AuraEnabled 
    public static List<Camping_Item__c> getItems() {
        return [SELECT Id, Name, Price__c, Quantity__c, Packed__c FROM Camping_Item__c];
    }
    
    @AuraEnabled
    public static Camping_Item__c saveItem(Camping_Item__c item) {
        upsert item;
        return item;
    }
}

CampingListForm Component

<aura:component >
    
     <aura:attribute name="newItem" type="Camping_Item__c"
     default="{ 'sobjectType': 'Camping_Item__c',
                    'Name': '',
                    'Packed__c': false,
                    'Price__c': '0',
                    'Quantity__c': '0' }"/>
	<aura:registerEvent name="addItem" type="c:addItemEvent"/>
    
  <div aria-labelledby="newitemform">
      <fieldset class="slds-box slds-theme--default slds-container--small">
    
        <legend id="newitemform" class="slds-text-heading--small 
          slds-p-vertical--medium">
          Add Camping Item
        </legend>
    
        <form class="slds-form--stacked">
    
          <div class="slds-form-element slds-is-required">
              <div class="slds-form-element__control">
                  <ui:inputText aura:id="name" label="Camping Item Name"
                      class="slds-input"
                      labelClass="slds-form-element__label"
                      value="{!v.newItem.Name}"
                      required="true"/>
              </div>
         </div>
            
          <div class="slds-form-element">
              <ui:inputCheckbox aura:id="packed" label="Packed?"
                  class="slds-checkbox"
                  labelClass="slds-form-element__label"
                  value="{!v.newItem.Packed__c}"/>
          </div>
            
        <div class="slds-form-element">
              <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}" />
    
              </div>
          </div>
    
         <div class="slds-form-element">
              <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}"/>
    
              </div>
          </div>
    
          <div class="slds-form-element">
              <ui:button label="Create Camping Item"
                  class="slds-button slds-button--brand"
                  press="{!c.clickCreateCampingItem}"/>
          </div>
    
        </form>
    
      </fieldset>
</div>

</aura:component>

CampingListForm Controller.js

({    
    
    clickCreateCampingItem : function(component, event, helper) {
        
        var validCamping = true;

        // Name must not be blank
        var nameField = component.find("name");
        var expname = nameField.get("v.value");
        if ($A.util.isEmpty(expname)){
            validCamping = false;
            nameField.set("v.errors", [{message:"Camping Item name can't be blank."}]);
        }
        else {
            nameField.set("v.errors", null);
        }

        
        var priceField = component.find("price");
        var price = priceField.get("v.value");
        if ($A.util.isEmpty(price) || isNaN(price) || (price <= 0.0)){
            validCamping = false;
            priceField.set("v.errors", [{message:"Camping Item price can't be blank."}]);
        }
        else {
            priceField.set("v.errors", null);
        }
        
        var quantityField = component.find("quantity");
        var quantity = quantityField.get("v.value");
        if ($A.util.isEmpty(quantity) || isNaN(quantity) || (quantity <= 0)){
            validCamping = false;
            quantityField.set("v.errors", [{message:"Camping Item quantity can't be blank."}]);
        }
        else {
            quantityField.set("v.errors", null);
        }

        if(validCamping){
            
            helper.createItem(component);
            
        }
        
    },
})

CampingListForm Helper.js

({
    
     createItem : function(component) {
        var newItem = component.get("v.newItem");
        var addEvent = component.getEvent("addItem");
        addEvent.setParams({"item" : newItem});
        addEvent.fire();
        component.set("v.newItem",
                     { 'sobjectType': 'Camping_Item__c',
                    'Name': '',
                    'Packed__c': false,
                    'Price__c': 0,
                    'Quantity__c': 0});
    }
})

Could anyone help me?

Thanks,
Regards.

Hi everyone!
I have a problem with the challenge, my App work fine but I don´t pass the challenge. This is my code:

campingList.cmp:
 

<aura:component controller="CampingListController">
    
    <ltng:require styles="/resource/SLDS105/assets/styles/salesforce-lightning-design-system-ltng.css"/>

	<aura:handler name="init" action="{!c.doInit}" value="{!this}"/>
    
     <aura:attribute name="newItem" type="Camping_Item__c"
     default="{ 'sobjectType': 'Camping_Item__c',
                    'Price__c': 0,
                    'Quantity__c': 0}"/>
    
    <div class="slds-card slds-p-top--medium">
    <ui:inputText aura:id="campname" label="Camping Name"
        value="{!v.newItem.Name}" required="true"/>
    <ui:inputCheckbox aura:id="packed" label="Packed?"
        value="{!v.newItem.Packed__c}"/>
     <ui:inputCurrency aura:id="price" label="Price"
        value="{!v.newItem.Price__c}" required="true"/>
     <ui:inputNumber aura:id="quantity" label="Quantity"
        value="{!v.newItem.Quantity__c}" required="true"/>
    
    <ui:button label="Create Camping" press="{!c.clickCreateCamping}"/>
    </div>
    
    <aura:attribute name="items" type="Camping_Item__c[]"/>	 
    <div class="slds-card slds-p-top--medium">
        <header class="slds-card__header">
            <h3 class="slds-text-heading--small">Campings</h3>
        </header>
        <section class="slds-card__body">
            <div id="list" class="row">
                <aura:iteration items="{!v.items}" var="item">
                    <c:campingListItem item="{!item}"/>
                </aura:iteration>
            </div>
        </section>
    </div>
</aura:component>

campingListController.js:
 

({
    
    // Load expenses from Salesforce
	doInit: function(component, event, helper) {

    // Create the action
    var action = component.get("c.getItems");

    // Add callback behavior for when response is received
    action.setCallback(this, function(response) {
        var state = response.getState();
        if (component.isValid() && state === "SUCCESS") {
            component.set("v.items", response.getReturnValue());
        }
        else {
            console.log("Failed with state: " + state);
        }
    });

    // Send action off to be executed
    $A.enqueueAction(action);
	},
    
    clickCreateCamping: function(component, event, helper) {
        
        if(helper.validateCampingForm(component)){
	        // Create the new expense
	        var newCamping = component.get("v.newItem");
	        helper.createItem(component, newCamping);
	    }
    }
})

campingListHelper.js
 

({
    
    createItem: function(component, camping) {
        
        var action = component.get("c.saveItem");
        action.setParams({
            "item": camping
        });
    	action.setCallback(this, function(response){
        var state = response.getState();
        if (component.isValid() && state === "SUCCESS") {
            var campings = component.get("v.items");
            campings.push(response.getReturnValue());
            component.set("v.items", campings);
        }
    	});
    	$A.enqueueAction(action);
    },
    
    validateCampingForm: function(component) {
      
     	var validQuantity = true;
        var validPrice = true;

        var nameField = component.find("campname");
        var campname = nameField.get("v.value");
        
        var quantityField = component.find("quantity");
        var quantity = quantityField.get("v.value");
        
        var priceField = component.find("price");
        var price = priceField.get("v.value");
        
        if ($A.util.isEmpty(campname) || $A.util.isEmpty(quantity) || $A.util.isEmpty(price)){
            validQuantity = false;
            validPrice = false;
            nameField.set("v.errors", [{message:"Camping name, quantity or price can't be blank."}]);
        }
        else {
            nameField.set("v.errors", null);
        }
		
		return(validQuantity && validPrice);        
	}
})

CampingListController.apxc:
 

public with sharing class CampingListController {

    @AuraEnabled
    public static List<Camping_Item__c> getItems() {
    
        // Check to make sure all fields are accessible to this user
        String[] fieldsToCheck = new String[] {
            'Id', 'Name', 'Packed__c', 'Price__c', 'Quantity__c'
        };
        
        Map<String,Schema.SObjectField> fieldDescribeTokens = 
            Schema.SObjectType.Camping_Item__c.fields.getMap();
        
        for(String field : fieldsToCheck) {
            if( ! fieldDescribeTokens.get(field).getDescribe().isAccessible()) {
                throw new System.NoAccessException();
                return null;
            }
        }        
        
        // Perform isAccessible() checking first, then
        return [SELECT Id, Name, Packed__c, Price__c, Quantity__c 
                FROM Camping_Item__c];
    }
    
    @AuraEnabled
    public static Camping_Item__c saveItem(Camping_Item__c item) {
        // Perform isUpdatable() checking first, then
        upsert item;
        return item;
    }
}

I am still getting this error:

Challenge Not yet complete... here's what's wrong:
The campingList JavaScript helper isn't saving the new record to the database or adding it to the 'items' value provider.

My App save the new record into the database and add it to the "items" list.
Thanks for your answers!




 

I'm trying to complete the Connect Components with Events trailhead and am getting this message when checking the challenge:

Challenge Not yet complete... here's what's wrong: 
The campingList component doesn't have a Name field using an inputText UI component.

This does not make sense to me as this challenge moved the input form to a new bundle. Why does it seem to want a inputText UI component in the campingList component?

I am using an inputText UI control in the form component and including the component on the CampingList component.

I feel I'm missing a step.  Ideas?

Thanks.

Challenge - Create a form to enter new items and display the list of items entered. To make our camping list look more appealing, change the campingHeader component to use the SLDS. Similar to the unit, style the Camping List H1 inside the slds-page-header. Modify the campingList component to contain an input form and an iteration of campingListItem components for displaying the items entered.
The component requires an attribute named items with the type of an array of camping item custom objects.
The component requires an attribute named newItem of type Camping_Item__c with default quantity and price values of 0.
The component displays the Name, Quantity, Price, and Packed form fields with the appropriate input component types and values from the newItem attribute.
The JavaScript controller checks to ensure that the Name, Quantity and Price values submitted are not null.
If the form is valid, the JavaScript controller pushes the newItem onto the array of existing items, triggers the notification that the items value provider has changed, and resets the newItem value provider with a blank sObjectType of Camping_Item__c.


My answer - 
<aura:component >
<aura:attribute name="items" type="Camping_Item__c[]"/>
<aura:attribute name="newitem" type="Camping_Item__c[]"  default="{ 'sobjectType': 'Camping_Item__c',
                   'Quantity__c'=0, 'Price__c'=0}"/>
 <p>Name:
        <ui:inputText value="{!v.newitem.name}"/>
    </p>    
  <p>Packed:
        <ui:inputCheckbox value="{!v.newitem.Packed__c}"/>
     
    </p>    
  <p>Price:
        <ui:inputCurrency value="{!v.newitem.Price__c}"/>
    </p>
    <p>Quantity:
        <ui:inputNumber value="{!v.newitem.Quantity__c}"/>
    </p>
</aura:component>


Error -

Challenge Not yet complete... here's what's wrong: 
The campingList component isn't iterating the array of 'items' and creating 'campingListItem' components.

Please share the correct solution.