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
LaurentDelcambreLaurentDelcambre 

Trailhead “Build a Lightning Component to Override a Standard Action” - “Use Lighting Data Service”

I am stuck at the Trailhead: "Build a Lightning Component to Override a Standard Action" - "Use Lighting Data Service"
with the error:
"Challenge Not yet complete... here's what's wrong: The JavaScript controller markup for the 'PropertyDialog' component is not correct."
Thanks Trailhead ><
Everythign is working as expected when I test it. I passed the next modules with no issues.
I only copy pasted what they required so this looks like some other mistakes is creeping in.
PropertyDialog:
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" > <aura:attribute name="picklistValues" type="Object" /> <aura:attribute name="propertyRecord" type="Property__c" /> <force:recordData aura:id="forceRecord" recordId="{!v.recordId}" targetFields="{!v.propertyRecord}" fields="Id,Name,Beds__c,Baths__c,Price__c,Status__c" mode="EDIT" /> <aura:handler name="init" value="{!this}" action="{!c.doInit}" /> <c:PicklistValues sObjectName="Property__c" fieldName="Status__c" picklistValues="{!v.picklistValues}" /> <lightning:input aura:id="propName" name="propName" label="Property Name" required="true" /> <lightning:input aura:id="propBeds" name="propBeds" label="Beds" /> <lightning:input aura:id="propBaths" name="propBaths" label="Baths" /> <lightning:input aura:id="propPrice" name="propPrice" label="Price" /> <lightning:select aura:id="propStatus" name="propStatus" label="Status"> <aura:iteration items="{!v.picklistValues}" var="item"> <option value="{!item}">{!item}</option> </aura:iteration> </lightning:select> <lightning:button variant="neutral" label="Cancel" /> <lightning:button variant="brand" label="Submit" onclick="{!c.saveRecord}" />


PropertyDialogController:
({ doInit : function(component, event, helper) { console.log('Property Dialiog init'); var recordData = component.find("forceRecord"); recordData.getNewRecord('Property__c', null, false, $A.getCallback(function() { console.log('callback from getNewRecord'); var rec = component.get("v.propertyRecord"); var error = component.get("v.recordError"); if (error || (rec === null)) { console.log("Error initializing record template: " + error); return; } })); }, saveRecord : function(component, event, helper){ console.log('saveRecord start'); var propBeds = parseInt(component.find('propBeds').get("v.value"), 10); var propBaths = parseInt(component.find('propBaths').get("v.value"), 10); var propPrice = parseInt(component.find('propPrice').get("v.value"), 10); component.set("v.propertyRecord.Name", component.find('propName').get("v.value")); component.set("v.propertyRecord.Beds__c", propBeds); component.set("v.propertyRecord.Baths__c", propBaths); component.set("v.propertyRecord.Price__c", propPrice); component.set("v.propertyRecord.Status__c", "Listed"); console.log('finished setting fields'); var tempRec = component.find("forceRecord"); console.log(tempRec); console.log(JSON.stringify(tempRec)) ; tempRec.saveRecord($A.getCallback(function(result) { console.log(result.state); var resultsToast = $A.get("e.force:showToast"); if (result.state === "SUCCESS") { resultsToast.setParams({ "title": "Saved", "message": "The record was saved." }); resultsToast.fire(); var recId = result.recordId; console.log('record id: '+recId); helper.navigateTo(component, recId); } else if (result.state === "ERROR") { console.log('Error: ' + JSON.stringify(result.error)); resultsToast.setParams({ "title": "Error", "message": "There was an error saving the record: " + JSON.stringify(result.error) }); resultsToast.fire(); } else { console.log('Unknown problem, state: ' + result.state + ', error: ' + JSON.stringify(result.error)); } })); }
})


PropertyDialogHelper:
({ navigateTo : function(component, recId) { var eventNav = $A.get("e.force:navigateToSObject"); eventNav.setParams({recordId: recId}); eventNav.fire(); }
})


Thanks for the help!
WDCi NatWDCi Nat
Hi LaurentDelcambre,

I'm getting the same issue - have you been able to solve yours and pass?  I don't know what I'm doing wrong :(

Any help would be greatly appreciated.

Cheers, Nat
Egor PalatovEgor Palatov

Hi all, try the code below.

PropertyDialog.cmp:
 

<force:recordData aura:id="forceRecord"
                      recordId="{!v.recordId}"
                      targetFields="{!v.propertyRecord}"
                      fields="Id,Name,Beds__c,Baths__c,Price__c,Status__c"
                      mode="EDIT" />
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />

    <c:PickListValues sObjectName="Property__c" fieldName="Status__c" picklistValues="{!v.picklistValues}" />

    <div aura:id="editDialog" role="dialog" tabindex="-1" aria-labelledby="header43" class="slds-modal slds-fade-in-open">
        <div class="slds-modal__container">
                <div class="slds-modal__header">
                    <h2 class="slds-text-heading--medium">{!v.modalContext} Record</h2>

            </div>
            <div class="slds-modal__content slds-p-around--medium slds-grid slds-wrap ">
                <lightning:input aura:id="propName" name="propName" label="Property Name" required="true" class="slds-size--1-of-1 slds-p-horizontal_x-small" value="{!v.propertyRecord.Name}" />
                <lightning:input aura:id="propBeds" name="propBeds" label="Beds" class="slds-size--1-of-2 slds-p-horizontal_x-small" value="{!v.propertyRecord.Beds__c}" />
                <lightning:input aura:id="propBaths" name="propBaths" label="Baths" class="slds-size--1-of-2 slds-p-horizontal_x-small" value="{!v.propertyRecord.Baths__c}" />
                <lightning:input aura:id="propPrice" name="propPrice" label="Price" class="slds-size--1-of-2 slds-p-horizontal_x-small" value="{!v.propertyRecord.Price__c}" />    
                <lightning:select aura:id="propStatus" name="propStatus" label="Status" class="slds-size--1-of-2 slds-p-horizontal_x-small" value="{!v.propertyRecord.Status__c}">
                    <aura:iteration items="{!v.picklistValues}" var="item">
                        <option value="{!item}">{!item}</option>
                    </aura:iteration>
                </lightning:select>
            </div>
            <div class="slds-modal__footer">                
                <lightning:button variant="neutral" label="Cancel" onclick="{!c.cancelDialog}" />
                <lightning:button variant="brand" label="Submit" onclick="{!c.saveRecord}" />
            </div>
        </div>
    </div>
    <div aura:id="overlay" class="slds-backdrop slds-backdrop--open"></div>
</aura:component>
PropertyDialogController.js:
({
	doInit  : function(component, event, helper) {
        var recId = component.get("v.recordId");
if (recId) {
    component.set("v.modalContext", "Edit");
}

		if (!recId) {
    component.find("forceRecord").getNewRecord(
        "Property__c",
        null,
        false,
        $A.getCallback(function() {
            var rec = component.get("v.propertyRecord");
            var error = component.get("v.recordError");
            if (error || (rec === null)) {
                console.log("Error initializing record template: " + error);
                return;
            }
        })
    ); 
}


	}
,
    saveRecord : function(component, event, helper) {
        var propBeds = parseInt(component.find('propBeds').get("v.value"), 10);
var propBaths = parseInt(component.find('propBaths').get("v.value"), 10);
var propPrice = parseInt(component.find('propPrice').get("v.value"), 10);

component.set("v.propertyRecord.Name", component.find('propName').get("v.value"));    
component.set("v.propertyRecord.Beds__c", propBeds);
component.set("v.propertyRecord.Baths__c", propBaths);
component.set("v.propertyRecord.Price__c", propPrice);
component.set("v.propertyRecord.Status__c", component.find('propStatus').get("v.value"));

var tempRec = component.find("forceRecord");
tempRec.saveRecord($A.getCallback(function(result) {
    console.log(result.state);
    var resultsToast = $A.get("e.force:showToast");
    if (result.state === "SUCCESS") {
        resultsToast.setParams({
            "title": "Saved",
            "message": "The record was saved."
        });
        resultsToast.fire();                
    } else if (result.state === "ERROR") {
        console.log('Error: ' + JSON.stringify(result.error));
        resultsToast.setParams({
            "title": "Error",
            "message": "There was an error saving the record: " + JSON.stringify(result.error)
        });
        resultsToast.fire();
        var recId = result.recordId;
helper.navigateTo(component, recId);

    } else {
        console.log('Unknown problem, state: ' + result.state + ', error: ' + JSON.stringify(result.error));
    }
}));

}

    
})

 
WDCi NatWDCi Nat
Hi Egor,

I'm afraid that didn't work...I'm getting this error message:
Uncaught Unknown controller action 'getPickListValuesIntoList'
Callback failed: serviceComponent://ui.flexipage.components.page.FlexipageControllerV2/ACTION$getPage


And Stack Trace:
a.H.get()@https://curious-goat-22263-dev-ed.lightning.force.com/auraFW/javascript/pX1ganOCAMJgvd2N5wQKGQ/aura_prod.js:289:176
Object.value [as get]()@https://curious-goat-22263-dev-ed.lightning.force.com/auraFW/javascript/pX1ganOCAMJgvd2N5wQKGQ/aura_prod.js:721:228
doInit()@https://curious-goat-22263-dev-ed.lightning.force.com/one/components/c/PickListValues.js:10:32

I honestly don't know what I'm doing wrong :(  
WDCi NatWDCi Nat
Hi @LaurentDelcambre,

In case you're still stuck, my other thread got an answer from @Gonzalo Diaz 15, and I finally passed the trail!!

https://developer.salesforce.com/forums/ForumsMain?id=9060G0000005M9f

Cheers, Nat
Sudheer Kumar 20Sudheer Kumar 20
Hi @ use this code 

ProperyDialog Component:

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    <aura:attribute name="picklistValues" type="Object" />
    <aura:attribute name="propertyRecord" type="Property__c" />
<force:recordData aura:id="forceRecord"
                recordId="{!v.recordId}"
                targetFields="{!v.propertyRecord}"
                fields="Id,Name,Beds__c,Baths__c,Price__c,Status__c"
                mode="EDIT" />
<aura:handler name="init" value="{!this}" action="{!c.doInit}" />

<c:PicklistValues sObjectName="Property__c" fieldName="Status__c" picklistValues="{!v.picklistValues}" />

<lightning:input aura:id="propName" name="propName" label="Property Name" required="true" />
<lightning:input aura:id="propBeds" name="propBeds" label="Beds" />
<lightning:input aura:id="propBaths" name="propBaths" label="Baths" />
<lightning:input aura:id="propPrice" name="propPrice" label="Price" />
    <lightning:select aura:id="propStatus" name="propStatus" label="Status"/>
    <aura:iteration items="{!v.picklistValues}" var="item"/>
    <option value="{!item}">{!item}</option>
<lightning:button variant="neutral" label="Cancel" />
<lightning:button variant="brand" label="Submit" onclick="{!c.saveRecord}" />
<lightning:button onclick="{!c.saveRecord}" label="submit"/>
</aura:component>

PropertyDialog Conroller:

({
    doInit : function(component, event, helper) 
    {
     component.find("forceRecord").getNewRecord(
        "Property__c",
        null,
        false,
        $A.getCallback(function() {
            var rec = component.get("v.propertyRecord");
            var error = component.get("v.recordError");
            if (error || (rec === null)) {
                console.log("Error initializing record template: " + error);
                return;
            }
        })
    );   
    },
    saveRecord : function(component, event, helper) {
        var propBeds = parseInt(component.find('propBeds').get("v.value"), 10);
var propBaths = parseInt(component.find('propBaths').get("v.value"), 10);
var propPrice = parseInt(component.find('propPrice').get("v.value"), 10);
component.set("v.propertyRecord.Name", component.find('propName').get("v.value"));    
component.set("v.propertyRecord.Beds__c", propBeds);
component.set("v.propertyRecord.Baths__c", propBaths);
component.set("v.propertyRecord.Price__c", propPrice);
component.set("v.propertyRecord.Status__c", component.find('propStatus').get("v.value"));
var tempRec = component.find("forceRecord");
tempRec.saveRecord($A.getCallback(function(result) {
    console.log(result.state);
    var resultsToast = $A.get("e.force:showToast");
    if (result.state === "SUCCESS") {
        resultsToast.setParams({
            "title": "Saved",
            "message": "The record was saved."
        });
        resultsToast.fire();
        var recId = result.recordId;
helper.navigateTo(component, recId);
    } else if (result.state === "ERROR") {
        console.log('Error: ' + JSON.stringify(result.error));
        resultsToast.setParams({
            "title": "Error",
            "message": "There was an error saving the record: " + JSON.stringify(result.error)
        });
        resultsToast.fire();
    } else {
        console.log('Unknown problem, state: ' + result.state + ', error: ' + JSON.stringify(result.error));
    }
}));
    }
    
})

PropertyDialog Helper:

({
    navigateTo: function(component, recId) {
        var navEvt = $A.get("e.force:navigateToSObject");
        navEvt.setParams({
            "recordId": recId
        });
        navEvt.fire();
    }
})