+ Start a Discussion
Ertyq MrskErtyq Mrsk 

Lightning page error when selecting a multi-select picklist field value in custom edit form using Salesforce LWC

I have a custom edit page wherein fields are rendered based on selected multi-select picklist field on page load. Upon changing its value, I am encountering following Lightning error message, which does not make sense at all.

User-added imageI inserted console.log statement and I can see that selected multi-select picklist values are returned.

Below is the sample statement printed:
selected value:ValueA
Even though it is working on page load, it does not work when I try to change the value. The idea is that fields must be hidden/displayed depending on the current selected value.

Meanwhile, here are the current codes I am working on:

    <div class="slds-theme_default">  
        <lightning-record-edit-form object-api-name="Contact" record-id={recordId} onsuccess={handleSuccess}>
                    <lightning-input-field field-name="MultiSelectPicklist__c"
                <div if:true={renderField1}>    
                    <lightning-input-field field-name="Field1__c">
                <div if:true={renderField2}>    
                    <lightning-input-field field-name="Field2__c">
import { LightningElement, track, api, wire } from 'lwc';
import { NavigationMixin } from 'lightning/navigation';
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import MULTIPICKLIST_FIELD from '@salesforce/schema/Contact.MultiSelectPicklist__c';

const fields = [MULTIPICKLIST_FIELD];

export default class EditFSCalculationToolLWC extends NavigationMixin(LightningElement) {
    @api recordId;

    @wire(getRecord, { recordId: '$recordId', fields })

    //this handles the field render on page load and works as expected
    get renderField1() {
        return getFieldValue(this.contact.data.includes('ValueA'), MULTIPICKLIST_FIELD) ? true : false; 

    //this handles another field render on page load and works as expected
    get renderField2() {
        return getFieldValue(this.contact.data.includes('ValueB'), MULTIPICKLIST_FIELD) ? true : false; 

    //this handles changes on multi-select picklist field and where the error occurs
    handleMultiSelectPicklistChange(event) {
        this.contact.MultiSelectPicklist__c = event.detail.value;
        const selectedValues = this.contact.MultiSelectPicklist__c;
        console.log('selectedValues' + selectedValues);
        if(selectedValues.includes('ValueA')) {
             this.renderField1 = true;
        else {
             this.contact.Field1__c = 0;
             this.renderField2= false; 
        if(selectedValues.includes('ValueB')) {
             this.renderField2 = true;
        else {
             this.contact.Field2__c = 0;
             this.renderField2= false; 
    handleSuccess( event ) { 
        //some code....


AbhishekAbhishek (Salesforce Developers) 

Based on the Error ID I found this information,

org.auraframework.impl.controller.AuraClientException: [NoErrorObjectAvailable] Script error.

If you need further clarification or doubts you can reach salesforce support with the Error ID.

Let me know if it helps you and close your query by marking it as solved so that it can help others in the future.

Ertyq MrskErtyq Mrsk
@Abhiskek , yes upon expanding the error box it displays [NoErrorObjectAvailable] Script error . But please be informed that I am just working on developer org. I reached out to Salesforce once regarding other issues but they cannot proceed as I did not purchase any accounts eligible for premium support.
AbhishekAbhishek (Salesforce Developers) 

It needs to be investigated by looking at server logs then only we can provide the exact solution or answer.

Yes, you are right for this query you need premium support.

Right now I don't have any other suggestion, But if I find to let you know.