Hi, while doing Aura input data using forms trail (https://trailhead.salesforce.com/content/learn/modules/lex_dev_lc_basics/lex_dev_lc_basics_forms) challenge, I am getting following error:

   

The campingList JavaScript controller doesn't appear to be checking if form fields are valid.

My code is as follows:

campingList.cmp

<aura:component >
    
	<aura:attribute name="items" type="Camping_Item__c[]"/>
    <aura:attribute name="newItem" type="Camping_Item__c"
                    default="{'sobjectType' : 'Camping_Item__c',
                               'Name': '',
                               'Packed__c': false,
                               'Quantity__c' : 0,
                               'Price__c' : 0}"/>
    <ol>

        <li>Bug Spray</li>

        <li>Bear Repellant</li>

        <li>Goat Food</li>

    </ol>

  <fieldset class="slds-box slds-theme--default slds-container--small">

    <legend id="newCampItemForm" class="slds-text-heading--small 
      slds-p-vertical--medium">
      Add Camping Item
    </legend>

    <form class="slds-form--stacked">

      <lightning:input aura:id="itemform" 
                       label="Name"
                       name="itemname"
                       value="{!v.newItem.Name}"
                       required="true"
      />

      <lightning:input type="number" 
                       aura:id="itemform" 
                       label="Quantity"
                       name="quantityfield"
                       value="{!v.newItem.Quantity__c}"
                       min="1"
                       required="true"
       />

      <lightning:input type="number" 
                       aura:id="itemform" 
                       label="Price"
                       name="price"
                       value="{!v.newItem.Price__c}"
                       formatter="currency"
                       step="0.1"
      />

      <lightning:input type="checkbox" 
                       aura:id="itemform" 
                       label="Packed?"
                       name="packed"
                       checked="{!v.newItem.Packed__c}"
      />

      <lightning:button label="Create Camping Item"
                        variant="brand"
                        onclick="{!c.clickCreateItem}"
      />

    </form>

  </fieldset>
   <div class ="slds-card slds-p-top--meduim">
      <header class ="slds-card__header">
         <h3 class = "slds-text-heading--small">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>

campingListItem.cmp
 

<aura:component >
    <aura:attribute name="item" type="Camping_Item__c" required="true"/>        
    
    <p>Name: {!v.item.name}</p>
    <p>Price: <lightning:formattednumber value="{!v.item.Price__c}" 
                                         style="currency" 
                                         currencyCode="USD" />    </p>
    <p>Quantity:<lightning:formattednumber value="{!v.item.Quantity__c}" />
    </p>
    <p>
       <lightning:button label="Packed!" 
                           title="Packed"
                           value="{! v.item.Packed__c }"/>

    </p>
</aura:component>

and  campingListController.js
 

({
    clickCreateItem: function(component, event, helper) {

        // Simplistic error checking
        var validItem = true;

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

        var priceField = component.find("price");
        var price = priceField.get("v.value");
        if ($A.util.isEmpty(price)){
            validItem = false;
            priceField.set("v.errors", [{message:"Price can't be blank."}]);
        }
        else {
            quantityField.set("v.errors", null);
        }


        if(validItem){            
            var newItem = JSON.parse(JSON.stringify(component.get("v.newItem")));
 
            console.log("Items before 'create': " + JSON.stringify(theItems));
		    theExpenses.push(newItem);
		    component.set("v.expenses", theItems);
		    console.log("Items after 'create': " + JSON.stringify(theItems));
            theItems.push(newItem);
            component.set("v.items", theItems);
        
        }
    }
})

In the above code though I am validating the inputs, getting no idea why still I am getting this error.