Calling Apex Class from Lwc only it is getting Saved

Question

I have create one custom object. Using a LWC component, I try to create one record but when try to save it from apex, only ID is getting printed not the Name. I am not getting why only Id is getting printed not the name.

Could anybody please help me ? Would be Appreciable.

LWC Component

import { LightningElement, track, api } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import insertDe from '@salesforce/apex/insertEvent.insertDe';
import Detail_OBJECT from '@salesforce/schema/Detail__c';

export default class insertEvent extends LightningElement {
  // @api childName;
  @track conRecord = Detail_OBJECT;

  handleChildNameChange(event) {
    this.conRecord.childName = event.target.value;
  }

  createRec() {
    insertDe({
        de: this.conRecord
    })
    .then(result => {
      // Clear the user enter values
      this.conRecord = {};

      // Show success messsage
      this.dispatchEvent(new ShowToastEvent({
        title: 'Success!!',
        message: 'Contact Created Successfully!!',
        variant: 'success'
      }), );
    })
    .catch(error => {
      this.error = error.message;
    });
  }
}

<template>
  <lightning-card title="Create Contact Record">
    <template if:true={conRecord}>
      <div class="slds-m-around--xx-large">
        <div class="container-fluid">
          <div class="form-group">
            <lightning-input 
              label="Child Name"
              name="childName"
              type="text"
              value={conRecord.childName}
              onchange={handleChildNameChange}
            ></lightning-input>
          </div>
        </div>
        <br />
        <lightning-button label="Submit" onclick={createRec} variant="brand"></lightning-button>
      </div>
    </template>
  </lightning-card>
</template>

Apex code

public with sharing class insertEvent {
  @AuraEnabled
  public static void insertDe(Detail__c de) {
    try {
      insert de;
    } catch (Exception e) {
      System.debug('--->'+e);
    }
  }
}

Answer 1

If you're using an LWC component then I suggest to also use Lightning Data Service.

To answer your specific issue, after an insert DML, only the Id field is returned. If you need other fields, then you need to run a query. This is because trigger / workflow / process builder can change some field value.

Answer 2

My suggestion if you want insert record directly from LWC component, you should use Lightning Data Service. But you need to execute some custom code or insert record from apex method, then you should pass only the data LWC component and create object in apex method then insert it.

public static void insertDe(String name) {
    Detail__c obj = new Detail__c();
    obj.childName = name;
    try {
      insert obj;
    } catch (Exception e) {
      System.debug('--->'+e);
    }
  }

Only pass the name from lwc component according to your posting code.