0

In my parent component , I have used child component inside and iteration. So for example child component is present twice in parent component. Now I want to show error message when on of the required field is missing in one of the child component. But the error message gets displayed in both the component. I am passing the value missing attribute from parent after performing check, but whenever there is iteration, it becomes issue as I am not sure how I can perform check here for fields of all components and pass respected "valueMissing" flag as the number of times child component occurs in parent is not fixed. Below is sample code for HTML part:

<template for:each={Mainobj} for:item="obj" for:index="index">
    <c-test-child selected-val = {obj.valueSelected__c}
                  recordsParent={picklistOptions}
                  onselected={selectedPicklistVal}
                  oncleared = {onClearPicklistVal}
                  error-msg="This field is required"
                  required-data = {valueMissing}
                  >
     </c-testChild>
</template>
0

In the child component, you can use a getter to achieve the same.

get showErrorMessage(){
   this.selectedPicklist===null ? return 'Value Missing'? return null;
}
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.