Get attribute key value returns null value. Can anyone please help me on this?

<div class="slds-p-top_x-large">
                        <lightning-datatable key-field="Id" data={studentdata} columns={studentColumns} data-record-id={Id}
                            draft-values={draftValues} hide-checkbox-column="true" resize-column-disabled="true"
                             onsave={handleStudentSave} onrowaction={handleRowAction}>

handleRowAction (event){
alert('Hello'   +  event.target.getAttribute("data-record-id"));
//alert('Hello'   +  event.target.getAttribute("key-field"));
  • try with row = event.detail.row – Sarvesh Mar 7 at 6:52
  • Undefined value – user3214361 Mar 7 at 7:44

It depends what you're trying to achieve, but will cover the possible outcomes you are trying to find.

Getting the record id of a row on rowaction

Check out the example in the lightning-datatable Component Reference and related Playground.

The gist of it is you would interrogate event.detail to get the row attributes (e.g. ID) as the rowaction events are dispatched from the rows which are effectively children of the datatable component. This concept is explained in detail in Create and Dispatch Events.

In your use case, you would get the record Id of each row using event.detail.row.id:

handleRowAction(event) {
    const recordId = event.detail.row.id;

Getting the key field used in the datatable

I suggest declaring a property for the key-field attribute in the module. This way you can use it in the module for other purposes.


keyField = 'Id';


<lightning-datatable key-field={keyField} ...></lightning-datatable>
| improve this answer | |

record id can be accessed using dataset event.target.dataset.recordId. record-id translates to recordId. The kebab cased 'data-' attributes from html translates to camel-cased dataset property names in JS. For example, if it was 'data-new-email-id' it translates to 'newEmailId' in JS.

| improve this answer | |
  <lightning-datatable key-field="Id" data={data} columns={columns} hide-checkbox-column="true"
        onrowaction={handleRowActions} ></lightning-datatable>

        let actionName = event.detail.action.name;
        console.log('Action Name '+ actionName);       
        let row = event.detail.row;
        console.log('selected Row '+ JSON.stringify(row));
        let rowId = event.detail.row.Id;
        console.log('selected Row '+ rowId);

Use event.detail.row : it will return row record. use event.deail.row.Id : it will return row Id

| improve this answer | |

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.