0

I have a datatable that shows data from a record query on a specific object, it allows edits and it also has comboboxes for the multitude of picklists. Each combobox has the correct options for the picklists they represent...so that's not a problem. The problem is it shows all the comboboxes as blank, which is obvious as i haven't set a default value. By default value i mean the value which currently exists on the record, but how do i pass the field data from the datatable down to the combobox?

I know at the combobox level i have to have @api someVariable and then edit the extension to add that as an attribute...say 'currentvalue' as an attribute..

but take these two picklists turn editable combobox

 { label: 'EGM Config', fieldName: 'Machine_Configuration__c', type: 'picklist', editable: true, wrapText: true, typeAttributes: { fieldname :'Machine_Configuration__c', currentvalue 'what goes here?'} },
        { label: 'Denom', fieldName: 'To_Theme_Denom__c', type: 'picklist', editable: true,wrapText: true, typeAttributes: { fieldname :'To_Theme_Denom__c', currentvalue : 'what goes here?'} },

i'm not exactly sure how i'm supposed to pass the field value of that row into the combobox... but i'm guessing the data exists in config.data somewhere, but because it's multiple records stored in that i'm not sure how to get the value from config.data.thisDynamicRow.thisField then pass than as an attritube to the combobox

data table html:

   <template>
    <c-quote-line-items-table_ext
        key-field="Id"
        data={config.data}
        columns={columns}
        onsave={handleSave}
        draft-values={draftValues}>
</c-quote-line-items-table_ext>
</template>

datatable js:

import { LightningElement, wire, api } from 'lwc';
import getConfig from '@salesforce/apex/quoteLineItemConfig_ctl.getConfigs';
import { refreshApex } from '@salesforce/apex';
import updateRecords  from '@salesforce/apex/QuoteLineItemConfig_ctl.updateRecords';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { getRecordNotifyChange } from 'lightning/uiRecordApi'
import getRowData from '@salesforce/apex/SObjectController2.getRowData';


const COLS = [
    { label: 'Cabinet', fieldName: 'Cabinet__c', editable: false },
    { label: 'Brand', fieldName: 'Brand__c', editable: false },
    { label: 'Theme', fieldName: 'To_Theme__c', editable: false },
    { label: 'Quantity', fieldName: 'Quantity__c', type: 'number', editable: true },
    { label: 'Incremental', fieldName: 'Incremental__c', type: 'boolean', editable: true },
    { label: 'Price', fieldName: 'Min_or_Flat_Fee_Amount__c', type: 'number', editable: true },
     { label: 'EGM Config', fieldName: 'Machine_Configuration__c', type: 'picklist', editable: true, wrapText: true, typeAttributes: { fieldname :'Machine_Configuration__c', value: {fieldName: 'Machine_Configuration__c'}, placeholder: {fieldName: 'Machine_Configuration__c'}}},
{ label: 'Denom', fieldName: 'To_Theme_Denom__c', type: 'picklist', editable: true, wrapText: true, typeAttributes: { fieldname :'To_Theme_Denom__c',  value: {fieldName: 'To_Theme_Denom__c'}, placeholder: {fieldName: 'To_Theme_Denom__c'}}},
{ label: 'Form Factor', fieldName: 'Form_Factor__c', type: 'picklist', editable: true,wrapText: true, typeAttributes: { fieldname :'Form_Factor__c', value: {fieldName: 'Form_Factor__c'}, placeholder: {fieldName: 'Form_Factor__c'}}},
   
    { label: 'Sign?', fieldName: 'Sign__c', type: 'text', editable: false },
    { label: 'Merchandise', fieldName: 'Signage__c', type: 'text', editable: false},
    { label: 'Stand', fieldName: 'Stands__c', type: 'text', editable:false},
    { label: 'Seats', fieldName: 'Seats__c', type: 'text', editable: false },
    { label: 'Notes', fieldName: 'Notes__c', editable: true }
];

export default class quoteLineItemsTable extends LightningElement {
    @api recordId;
    columns = COLS;
    draftValues = [];
    @wire(getConfig, { recordId: '$recordId' })
    config;

   async handleSave(event) {
        const updatedFields =  event.detail.draftValues
        
        const notifyChangeIds = updatedFields.map(row => {return { "recordId" : getRowData.Id}});
    
    try {
        const result = await updateRecords({data: updatedFields});
        console.log(JSON.stringify('apex return ' + result));
        this.dispatchEvent(
            new ShowToastEvent({
                title: 'Success',
                messsage: 'Record Updated',
                variant: 'succes'
            })
        );

        getRecordNotifyChange(notifyChangeIds);

        refreshApex(this.config).then(() => {
            this.draftValues = [];
        });
    } catch (error) {
        this.dispatchEvent(
            new ShowToastEvent({
                title: 'Error Updating or refreshing records',
                message: 'error.body.message',
                variant: 'error'
            })
        );
    }
    }
}

data table extension html

    <template>
        <c-quote-Dynamic-Combo record-id={value}
        label={typeAttributes.label} 
        value={typeAttributes.value}
        placeholder={typeAttributes.placeholder} 
        options={typeAttributes.options} 
        context={typeAttributes.context}
        fieldname={typeAttributes.fieldname}
        currentvalue={typeAttributes.currentvalue}>
        </c-quote-Dynamic-Combo>
    </template>

data table extension js

import LightningDatatable from 'lightning/datatable';
import dPicklist from './quoteCombo.html';


export default class quoteLineItemsTable_ext extends LightningDatatable {
    
    static customTypes = { 
        picklist: {
            template: dPicklist,
            typeAttributes: ['label', 'placeholder', 'options', 'value', 'context','fieldname','currentvalue'],
        },
    };

}

the custom component aka a combobox html:

<template>
    <lightning-combobox
            label={Name}
            placeholder="--none--"
            value={value}
            onchange={handleSelect}
            options={pickVals}>
    </lightning-combobox>
</template>

the js for the combobox

    import { LightningElement,wire,api,track } from 'lwc';
import getPicklist from '@salesforce/apex/quoteLineItemConfig_ctl.getPicklist';

export default class quoteDynamicCombo extends LightningElement {
    error;
    @api fieldname;

    @track choice;
    @track pickVals;
    
    @wire(getPicklist, { fieldname: '$fieldname'})
    wiredpickList({ error, data }) {
        if (data) {
            this.pickVals = data.map((cls) => Object.assign({}, { label: cls.label, value: cls.value }));
        } else if (error) {
            this.error = error;
        }
    }
    handleSelect(event) {
        this.choice= event.detail.value;
    }
}

the apex controller

 public with sharing class quoteLineItemConfig_ctl {
     
      Final Static String THEME_CONVERSION = 'Theme_Conversion__c';

    public class customSelectOption {
        public customSelectOption() {
            this.value = '';
            this.label = '';
    
        }
    
        public customSelectOption(String value, String label) {
            this.value = value;
            this.label = label;
        }
    
    
        @AuraEnabled
        public String label { get;set; }
        @AuraEnabled
        public String value { get;set; }
    }
      
        @AuraEnabled (cacheable=true)
        public static list <Theme_Conversion__c> getConfigs(string recordId){
            return  [SELECT Id, Cabinet__c, Brand__c, To_Theme__c, Quantity__c,Incremental__c,Min_or_Flat_Fee_Amount__c,To_Theme_Denom__c,Form_Factor__c, Machine_Configuration__c,Sign__c,Signage__c,Stands__c,Seats__c,Notes__c  
                     FROM Theme_Conversion__c 
                     WHERE Sales_Toolkit__c =: recordId];
        }
    
        @AuraEnabled
        public static string updateRecords(Object data){
            List<Theme_Conversion__c> configsForUpdate = (List<Theme_Conversion__c>) JSON.deserialize(
                JSON.serialize(data),
                List<Theme_Conversion__c>.class
            );
            try {
                update configsForUpdate;
                return 'Success: successfully updated';
            }
            catch(Exception e) {
                return 'The following exception has occured: ' + e.getMessage();
            }
        }
        
        @AuraEnabled(cacheable=true)
        public static list<customSelectOption> getPicklist(string fieldname){
           
            List<customSelectOption> options = new List<customSelectOption>();
            String objectName = THEME_CONVERSION;
            Schema.SObjectType sObjName = Schema.getGlobalDescribe().get(objectName);
            Schema.DescribeSObjectResult SObjectDescribe = sObjName.getDescribe();
            Map<String,Schema.SObjectField> fields = SObjectDescribe.fields.getMap() ;
            Schema.DescribeFieldResult fieldResult = fields.get(fieldname).getDescribe();
            List<Schema.PicklistEntry> ple = fieldResult.getPicklistValues();
            for(schema.PicklistEntry plVal : ple){
                options.add(new customSelectOption(plVal.getLabel(), plVal.getValue()));
            }
            return options;
    
         }    
    }
0

So i posted this...four hours ago. Then i started hammering away and asking my dog if he knew the answer, he's my rubber duck Then i simply came to the point where i said "well what i pass the value/placeholder as i would the field value for that row....because the data iterates over the rows already based on the fieldname: 'fieldname'. I did this in my typeAttributes

 typeAttributes: { fieldname :'To_Theme_Denom__c',  value: {fieldName: 'To_Theme_Denom__c'}, placeholder: {fieldName: 'To_Theme_Denom__c'}}

and it worked.

This site is temporarily in read only mode and not accepting new answers.

Not the answer you're looking for? Browse other questions tagged .