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
mayank mishra 39mayank mishra 39 

Use Lightning Data Service to Work with Data(getting error while doing trailhead challenge)

Hi Everyone,
I am getting issue while doing this LWC challenge - 
Use Lightning Data Service to Work with Data

ErrorWe can’t find an event handler named 'handleSuccess'.

Code -
contactCreator.Js
import { LightningElement,api,track } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
//import CONTACT_OBJECT from '@salesforce/schema/Contact';
//import FIRSTNAME_FIELD from '@salesforce/schema/Contact.FirstName';
//import LASTNAME_FIELD from '@salesforce/schema/Contact.LastName';
//import EMAIL_FIELD from '@salesforce/schema/Contact.Email';


export default class ContactCreator extends LightningElement {
    @api recordId;
    @api objectApiName;
    @track fields = ['FirstName', 'LastName', 'Email'];

    handleSuccess(event){
        
        const toastEvent = new ShowToastEvent({
            title: "Contact created",
            message: "Record ID: " + event.detail.id,
            variant: "success"
        });
        this.dispatchEvent(toastEvent);
    }

}
contactCreator.html
<template>
    <lightning-card>
        <lightning-record-form
            object-api-name={objectApiName}
            fields={fields}
            record-id={recordId} 
            onsuccess={handleSuccess}>
        </lightning-record-form>
    </lightning-card>
</template>

Please help me what i am doing wrong here as i have declared handleSuccess event in the JS .

Thanks,
Best Answer chosen by mayank mishra 39
David Zhu 🔥David Zhu 🔥
You may need to change line 7 in html to :
onsuccess={handleSuccess}

All Answers

David Zhu 🔥David Zhu 🔥
You may need to change line 7 in html to :
onsuccess={handleSuccess}
This was selected as the best answer
mayank mishra 39mayank mishra 39
Thanks David for your Help. 
 
Manjunath S 90Manjunath S 90
I have the same issue. I have 
<template>
    <lightning-card>
        <lightning-record-form
            object-api-name={contactApiName}
            fields={contactFields}
            onsuccess={handleSuccess}>
        </lightning-record-form>
    </lightning-card>
</template>


and below JS:

 

import { LightningElement } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import CONTACT_OBJECT from '@salesforce/schema/Contact';
import CONTACT_FIRSTNAME from '@salesforce/schema/Contact.FirstName';
import CONTACT_LASTNAME from '@salesforce/schema/Contact.LastName';
import CONTACT_EMAIL from '@salesforce/schema/Contact.Email';

export default class ContactCreator extends LightningElement {
    contactApiName = CONTACT_OBJECT;
    contactFields = [CONTACT_FIRSTNAME, CONTACT_LASTNAME, CONTACT_EMAIL];

    handleSuccess(evt){
        let showSuccess = new ShowToastEvent({
            title: "Contact created!",
            message: "Contact Id "+evt.detail.id,
            variant: "Success"
        });
        this.dispatchEvent(showSuccess);
    }
}

Not sure what I am doing wrong. I do get a success toast and can see the Contact when I query.
Manjunath S 90Manjunath S 90
@my above reply, the issue was that I had passed the 'event' argument as 'evt'. Chaging it to 'event' worked.
Anil Reddy ParpatiAnil Reddy Parpati
Please use this below code. I have completed ( "Use Lightning Data Service to Work with Data")

contactCreator.js::

import { LightningElement } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import CONTACT_OBJECT from '@salesforce/schema/Contact';
import CONTACT_FIRSTNAME from '@salesforce/schema/Contact.FirstName';
import CONTACT_LASTNAME from '@salesforce/schema/Contact.LastName';
import CONTACT_EMAIL from '@salesforce/schema/Contact.Email';
export default class ContactCreator extends LightningElement {
    contactApiName = CONTACT_OBJECT;
    contactFields = [CONTACT_FIRSTNAME, CONTACT_LASTNAME, CONTACT_EMAIL];
    handleSuccess(event){
        let showSuccess = new ShowToastEvent({
            title: "Contact created!",
            message: "Contact Id "+event.detail.id,
            variant: "Success"
        });
        this.dispatchEvent(showSuccess);
    }
}
========================================================================================
contactCreator.Html::

<template>
    <lightning-card>
        <lightning-record-form
            object-api-name={objectApiName}
            fields={fields}
            onsuccess={handleSuccess}>
        </lightning-record-form>
    </lightning-card>
</template>

Thanks,
Anil.
Satishbabu Anupoju 1Satishbabu Anupoju 1
You can try the below working code:

contactCreator.html
-------------------------

<template>
    <lightning-card>
        <lightning-record-form
            object-api-name={objectApiName} //getting from js
            fields={fields} //getting from js
            onsuccess={handleSuccess}> //invoking in js and returning toast message on success
        </lightning-record-form>
    </lightning-card>
</template>


contactCreator.js
----------------------
import { LightningElement } from 'lwc';
import CONTACT_OBJECT from '@salesforce/schema/Contact';
import CONTACT_FIRSTNAME from '@salesforce/schema/Contact.FirstName';
import CONTACT_LASTNAME from '@salesforce/schema/Contact.LastName';
import CONTACT_EMAIL from '@salesforce/schema/Contact.Email';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
export default class ContactCreator extends LightningElement {
    //Assigning CONTACT_OBJECT adaptorId to objectApiName variable
    objectApiName = CONTACT_OBJECT;
    //Assigning contact adaptorIds [CONTACT_FIRSTNAME, CONTACT_LASTNAME, CONTACT_EMAIL] field variable
    fields =  [CONTACT_FIRSTNAME, CONTACT_LASTNAME, CONTACT_EMAIL];
    //Handling the handleSuccess event and returning toast message on success
    handleSuccess(event){
        let toastSuccessMessage = new ShowToastEvent({
            title: 'Account Created',
            message: 'Record Id'+event.detail.id,
            variant: 'success'
        });
        this.dispatchEvent(toastSuccessMessage);
    }
}

contactCreator.js-meta.xml
------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>49.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
    </targets>
</LightningComponentBundle>

LWC Working with Data Output
Ridima Shukla 11Ridima Shukla 11
I passed the challenge. Can refer this, if you are facing any difficulties

contactCreator.js

import { LightningElement } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import CONTACT_OBJECT from '@salesforce/schema/Contact';
import First_NAME_FIELD from '@salesforce/schema/Contact.FirstName';
import Last_NAME_FIELD from '@salesforce/schema/Contact.LastName';
import EMAIL_FIELD from '@salesforce/schema/Contact.Email';
export default class AccountCreator extends LightningElement {
    objectApiName = CONTACT_OBJECT;
    fields = [First_NAME_FIELD, Last_NAME_FIELD, EMAIL_FIELD];
    handleSuccess(event) {
        const toastEvent = new ShowToastEvent({
            title: "Account created",
            message: "Record ID: " + event.detail.id,
            variant: "success"
        });
        this.dispatchEvent(toastEvent);
    }
}

---------------------------------------------------------------------------------------------------------------------------------------------------------------------
contactCreator.html

<template>
    <lightning-card>
        <lightning-record-form
            object-api-name={objectApiName}
            fields={fields}
            onsuccess={handleSuccess}>
        </lightning-record-form>
    </lightning-card>
</template>

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------

contactCreator.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>51.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__AppPage</target>
    </targets>
</LightningComponentBundle>
Wayne.HWayne.H
After many tests, I found out only because of the code specification.
like this :
//Complete
handleSuccess(event) {
    //do some 
}
//Fail
handleSuccess (event) {
    //do some 
}

just because there is a space after handleSuccess



 
Tammy HansfordTammy Hansford
Small mistake always give you the best learning experience if you make it from the trying, also you can ask professionals to write much things from https://www.pinterest.com/topwritersreview/best-essay-writing-service/ of writing website where many students get things done on time without having so much stress.