You need to sign in to do that
Don't have an account?
Balu Phrabha123
How to make required field on Lead creation LWC
HI All,
I want to make phone required when i click the create lead button.
But the lead is creating without phone. And also i need to show when phone is empty show tost message.
Below is my code and it is not working.
HTML:
<div class="slds-col slds-size_2-of-7">
<lightning-input-field class="Phone" required field-name="Phone"
value={leadphone}>
</lightning-input-field>
</div>
Js.code
handleSubmit(event) {
this.createlabel = "Creating Lead...";
event.preventDefault();
const fields = event.detail.fields; // stop the form from submitting
if (this.template.querySelector('.Phone') === '') {
this.fieldvalidationerror();
} else {
this.template.querySelector('lightning-record-edit-form').submit(fields);
}
}
//Tost Message
fieldvalidationerror() {
const event = new ShowToastEvent({
mode: 'dismissable',
variant: 'error',
title: 'We hit a snag!',
message: 'Please fill required fields'
});
this.dispatchEvent(event);
}
I want to make phone required when i click the create lead button.
But the lead is creating without phone. And also i need to show when phone is empty show tost message.
Below is my code and it is not working.
HTML:
<div class="slds-col slds-size_2-of-7">
<lightning-input-field class="Phone" required field-name="Phone"
value={leadphone}>
</lightning-input-field>
</div>
Js.code
handleSubmit(event) {
this.createlabel = "Creating Lead...";
event.preventDefault();
const fields = event.detail.fields; // stop the form from submitting
if (this.template.querySelector('.Phone') === '') {
this.fieldvalidationerror();
} else {
this.template.querySelector('lightning-record-edit-form').submit(fields);
}
}
//Tost Message
fieldvalidationerror() {
const event = new ShowToastEvent({
mode: 'dismissable',
variant: 'error',
title: 'We hit a snag!',
message: 'Please fill required fields'
});
this.dispatchEvent(event);
}
if (this.template.querySelector('.Phone') === '') {
this.template.querySelector('.Phone') gets the DOM object for phone. It should be checking the value of the DOM object.
if (this.template.querySelector('.Phone').value.trim() == "" {
if ( this.template.querySelector('.Phone').value== undefined || this.template.querySelector('.Phone').value.trim()== "" || ) {
Hi,
you can try this:
If the above suggestion worked, let us know by marking the answer as "Best Answer" right under the comment which will help the rest of the community should they have a similar issue in the future.