How to pass array to apex method in LWC

Question

I am creating custom functionality of Adding opportunityLineItem in LWC. Once I input details and click 'Save' I am not able to pass string value or object value to Apex method. Throwing error. ({"status":500,"body":{"message":"Unable to read SObject's field value[s]"})

Selected records:

showContacts() {
    this.bShowModal = true;

    this.selectedCons = [];

    let selectedRows = this.template.querySelectorAll('lightning-input'); 

    // based on selected row getting values of the contact
    for(let i = 0; i < selectedRows.length; i++) {

        if(selectedRows[i].checked && selectedRows[i].type === 'checkbox') { 
            this.selectedCons.push({
                Name: selectedRows[i].value,
                Id: selectedRows[i].dataset.id, 
                Product2Id : selectedRows[i].value,
                UnitPrice : selectedRows[i].value,
                SalesPrice : '',
                OpportunityId : '0062v00001EnkGAAAZ',
                PricebookEntryId : selectedRows[i].dataset.id,
                Quantity :0
            })
        }
    }

'selectedCons' is an array that keeps the selected values. Once I input the value and Click Save. Save Method below

saveMultipleOli() {

    console.log("selectedCons list---"+JSON.stringify(this.selectedCons));
    console.log("selectedCons list2---"+this.selectedCons);
    createOliRecord({ oliList : this.selectedCons})
        .then(result => {
            this.message = result;
            this.error = undefined;       
            this.selectedCons.forEach(function(item){                   
                item.PricebookEntryId=''; 
                item.Quantity='';
                item.UnitPrice = '';  
                item.OpportunityId =''  
            });

            //this.accountRecList = [];
            if(this.message !== undefined) {
                this.dispatchEvent(
                    new ShowToastEvent({
                        title: 'Success',
                        message: 'Accounts Created!',
                        variant: 'success',
                    }),
                );
            }

            console.log(JSON.stringify(result));
            console.log("result", this.message);
        })
        .catch(error => {
            this.message = undefined;
            this.error = error;
            this.dispatchEvent(
                new ShowToastEvent({
                    title: 'Error creating records',
                    message: error.body.message,
                    variant: 'error',
                }),
            );
            console.log("error", JSON.stringify(this.error));
        });
}

Apex Method:

 @AuraEnabled
public static List<OpportunityLineItem> createOliRecord(List<OpportunityLineItem> oliList){

    system.debug('***'+oliList);

    return oliList;
}

Not able to pass the selected value to my Apex method. Please help!

Answer 1

You'll typically have to serialize any data you're bringing back from the server. Try changing your return type to a String and returning the serialized array to the client. Then JSON.parse() the returned string into an array in the client js.

UPDATE:

I misunderstood that the flow of your code is going from client to server. I believe adding an sObjectType property to the javascript object will resolve the issue, per @nbrown's suggestion.

Answer 2

Adding sObjectType as a property to your JS objects helps the middleware serialize and deserialize objects when communicating between your components and your AuraEnabled methods. I believe making the below update inside showContacts() will fix your problem:

showContacts() {
    this.bShowModal = true;

    this.selectedCons = [];

    let selectedRows = this.template.querySelectorAll('lightning-input'); 

    // based on selected row getting values of the contact
    for(let i = 0; i < selectedRows.length; i++) {

        if(selectedRows[i].checked && selectedRows[i].type === 'checkbox') { 
            this.selectedCons.push({
                sObjectType: 'OpportunityLineItem', // <--- *** sObjectType property ***
                Name: selectedRows[i].value,
                Id: selectedRows[i].dataset.id, 
                Product2Id : selectedRows[i].value,
                UnitPrice : selectedRows[i].value,
                SalesPrice : '',
                OpportunityId : '0062v00001EnkGAAAZ',
                PricebookEntryId : selectedRows[i].dataset.id,
                Quantity :0
            })
        }
    }