Salesforce Asked by SfdcBat on October 4, 2021
I have an object Foo__c that has MD relationship to Zoo__c object. I am trying to create Foo__c record using lightning-record-edit-form
. This is for learning purpose. Below is my code:
HTML:
<template>
<lightning-record-edit-form object-api-name="Foo__c" record-id={recordId} onsubmit={handleSubmit}
onsuccess={handleSuccess}>
<lightning-messages></lightning-messages>
<lightning-input-field field-name="zoo__c" class="slds-form-element__label" variant="label-hidden">
</lightning-input-field>
<lightning-input-field label="Name" field-name="Name" class="slds-form-element__label">
</lightning-input-field>
<div class="slds-align_absolute-center" style="margin-top: 5px">
<lightning-button type="submit" variant="brand" label="Submit" icon-name="utility:save"></lightning-button>
</div>
</lightning-record-edit-form>
</template>
JS:
import { LightningElement, api } from 'lwc';
export default class Recordeditform extends LightningElement {
zooId;
/** Pls ignore getter and setter here as it does not have any significance **/
@api
get recordId() {
return this.zooId;
}
set recordId(value) {
this.setAttribute('zooId', value);
this.zooId = value;
}
handleSubmit(event) {
event.preventDefault();
const inputFields = this.template.querySelectorAll(
'lightning-input-field'
);
if (inputFields) {
inputFields.forEach(field => {
console.log('Field is==> ' + field.fieldName);
console.log('Field is==> ' + field.value);
});
}
this.template.querySelector('lightning-record-edit-form').submit(inputFields);
}
}
Console output:
I get this error, even though console show zoo__c
field is populated.
What am I doing wrong here?
Use event to capture fields.
handleSubmit(event) {
event.preventDefault();
const inputFields = event.detail.fields;
if (inputFields) {
inputFields.forEach(field => {
console.log('Field is==> ' + field.fieldName);
console.log('Field is==> ' + field.value);
});
}
this.template.querySelector('lightning-record-edit-form').submit(inputFields);
}
}
Correct answer by Anshul Agrawal on October 4, 2021
Change the this.template.querySelector('lightning-record-edit-form').submit(inputFields);
in handleSubmit()
to just this.template.querySelector("lightning-record-edit-form").submit();
and it would work. Also, you have onsuccess event handler in the form but no handler function in the js - may be missed in copy paste.
Answered by Naga on October 4, 2021
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP