1

With an aura component lightning:datatable its possible to change the label of a button on rowaction. In fact an example is provided in the lightning component reference by changing the label fieldName 'actionLabel'.

editRowStatus: function (cmp, row) {
    var data = cmp.get('v.data');
    data = data.map(function(rowData) {
        if (rowData.id === row.id) {
            switch(row.actionLabel) {
                case 'Approve':
                    rowData.actionLabel = 'Complete';
                    break;
                case 'Complete':
                    rowData.actionLabel = 'Close';
                    break;
                case 'Close':
                    rowData.actionLabel = 'Closed';
                    rowData.actionDisabled = true;
                    break;
                default:
                    break;
            }
        }
        return rowData;
    });
    cmp.set("v.data", data);
},

Has anyone found the way to do this with the lightning web component of lightning-datatable? My column button is defined as

{label: 'View Files', type: 'button', typeAttributes: {label: {fieldName: 'NumberOfFiles'}, title: 'View', name: 'view_files', disabled: {fieldName: 'DisableViewFiles'}}},

The label fieldName is NumberOfFiles and is manipulated with the following where the datatable data is @track workOrderLineItems. I'm unable to change the field label and have been unable to find a workaroud.

handleFileUpload(event) {
        let rowId = event.detail.rowId;
        let files = event.detail.files;

        if(files !== undefined && files.length > 0) {
            for(let i=0; i<this.workOrderLineItems.length; i++) {
                if(this.workOrderLineItems[i].Id === rowId) {
                    this.workOrderLineItems[i].NumberOfFiles = (this.workOrderLineItems[i].NumberOfFiles + files.length).toString();
                    this.workOrderLineItems[i].DisableViewFiles = false;

                    break;
                }
            }
        }
    }    
0

1 Answer 1

1

If anyone runs into this issue the workaround I found is to deep clone the the array of data that is feeding lightning-datatable and and reassign to the array.

As an example, workOrderLineItems is feeding my lightning-datatable:

let tempLineItems = JSON.parse(JSON.stringify(this.workOrderLineItems));
this.workOrderLineItems = tempLineItems;
1

You must log in to answer this question.

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