0

I'm showing a datatable with a list of opportunities. Now I want to allow for a dropdown menu of actions. When I click on the arrow to the left of the opportunity detail row, it is giving me this error in the browser.

[a.reduce is not a function] c()@https://data-velocity-3907.lightning.force.com/components/lightning-datatable-utils.js:2:310
Object.getMenuAlignment()@https://data-velocity-3907.lightning.force.com/components/lightning-datatable-utils.js:2:1572
n.get computedMenuAlignment as computedMenuAlignment@https://data-velocity-3907.lightning.force.com/components/lightning-primitive-cell-actions.js:2:1844
j()@https://data-velocity-3907.lightning.force.com/components/lightning-primitive-cell-actions.js:2:615"

This is my lightning:datatable:

<div style="position: relative; height: 30vh">
 <lightning:datatable
   keyField="id"
   data="{! v.data}"
   columns="{! v.columns }"
   hideCheckboxColumn="true"
   onrowaction="{! c.handleRowAction }"/>
</div>

Here's my handleRowAction function:

 handleRowAction: function (component, event, helper) {
    const action = event.getParam('action')
    const row = event.getParam('row')
    console.log(row)
    switch (action.name) {
        case 'show_details':
            // let navEvt = $A.get('e.force:navigateToSObject')
            // navEvt.setParams({
            //     'recordId': row.Id,
            //     'slideDevName': 'detail'
            // })
            // navEvt.fire()
            alert('Showing Details: ' + JSON.stringify(row));
            break
    }
  }

Here's the v.columns situation:

component.set('v.columns', [
      {label: 'Opportunity name', fieldName: 'Name', type: 'text'},
      // {label: 'Account name', fieldName: 'accountName', type: 'text' },
      {label: 'Close date', fieldName: 'CloseDate', type: 'date' },
      {label: 'Amount', fieldName: 'Amount', type: 'currency' },
      //{label: 'ID', fieldName: 'ID', type: 'ID'},
      {type: 'action', typeAttributes: { rowActions: { label: 'Show Details', name: 'show_details' } } } 
    ])

Again the error occurs just as I try to click the action menu arrow on the opportunity detail row on the table.

0

While setting v.columns, the action attribute takes in an 'array' of rowActions. So this should help:

{type: 'action', typeAttributes: { rowActions: [{ label: 'Show Details', name: 'show_details' }] } }
  • Thank you very much. This is the solution to the problem. – supernova Jul 27 '18 at 2:34

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.