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

Passing values to Parent LWC Component using event.detail.value

Hi All,
I am trying to pass values to parent component using event in LWC.
But I am not able to retrieve the fields and use in a SOQL query.
I am getting [Object,Object] as field value.
I am trying to to do JSON.stringify() also.It is showing this
I need value of that field Guest_Hotel_City__c to make use of it in SOQL query.
Please help!!
Thanks in Advance.
JS code:
import { LightningElement } from 'lwc';
export default class HotelListingComponent extends LightningElement {
    const varcityofhotel=event.detail.cityofhotel;
    const varpreferredhoteltype=event.detail.preferredhoteltype;
    var myjson=JSON.stringify(varcityofhotel);
    console.log("value after stringifying:",myjson);
        alert('Event handled in Parent Comp');
        alert('Guest Hotel City is: '+varcityofhotel);
        alert('Guest Hotel Type is: '+varpreferredhoteltype);

Hi srkSF,

Can you share the code for event in Child Component.



Hi Sucharita,
Thanks for replying.Event code is at the bottom.

Child Component JS code:

import { LightningElement,api } from 'lwc';
import GUEST_OBJECT from '@salesforce/schema/Guest_Master__c';
import FIRSTNAME_FIELD from '@salesforce/schema/Guest_Master__c.Guest_First_Name__c';
import LASTNAME_FIELD from '@salesforce/schema/Guest_Master__c.Guest_Last_Name__c';
import PHONE_FIELD from '@salesforce/schema/Guest_Master__c.Guest_Phone__c';
import EMAIL_FIELD from '@salesforce/schema/Guest_Master__c.Guest_Email__c';
import CITYOFHOTEL_FIELD from '@salesforce/schema/Guest_Master__c.City_of_Hotel__c';
import PREFERREDHOTELTYPE_FIELD from '@salesforce/schema/Guest_Master__c.Preferred_Hotel_Type__c';
import createGuest from '@salesforce/apex/createGuest.createGst';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

export default class CreateRecordWithFieldIntigrity extends LightningElement {

    fname = FIRSTNAME_FIELD;
    lname = LASTNAME_FIELD;
    phone = PHONE_FIELD;
   @api  cityofhotel=CITYOFHOTEL_FIELD;
   @api preferredhoteltype=PREFERREDHOTELTYPE_FIELD;
   rec = {
   handleFirstNameChange(event) {
        this.rec.Guest_First_Name__c =;
        console.log("FirstName", this.rec.Guest_First_Name__c);
    handleLastNameChange(event) {
        this.rec.Guest_Last_Name__c =;
        console.log("LastName", this.rec.Guest_Last_Name__c);
    handlePhnChange(event) {
        this.rec.Guest_Phone__c =;
        console.log("Phone", this.rec.Guest_Phone__c);
    handleEmailChange(event) {
        this.rec.Guest_Email__c =;
        console.log("Email", this.rec.Guest_Email__c);
    handleCityofHotelChange(event) {
        this.rec.City_of_Hotel__c =;
        console.log("CityofHotel", this.rec.City_of_Hotel__c);
    handlePreferredHotelTypeChange(event) {
        this.rec.Preferred_Hotel_Type__c =;
        console.log("PreferredHotelType", this.rec.Preferred_Hotel_Type__c);

    handleClick() {
        createGuest({ guest : this.rec })
            .then(result => {
                this.message = result;
                this.error = undefined;
                if(this.message !== undefined) {
                    this.rec.Guest_First_Name__c = '';
                    this.rec.Guest_Last_Name__c = '';
                    this.rec.Guest_Phone__c = '';
                        new ShowToastEvent({
                            title: 'Success',
                            message: 'Guest created',
                            variant: 'success',
                console.log("result", this.message);
            .catch(error => {
                this.message = undefined;
                this.error = error;
                    new ShowToastEvent({
                        title: 'Error creating record',
                        message: error.body.message,
                        variant: 'error',
                console.log("error", JSON.stringify(this.error));
            const evt=new CustomEvent('mycustomevent',{