Get data object on row click

Question

I am using jquery datatables and I am having trouble grabbing the row data on click event. How can I get my data object from my datatable on row click event?

What I do:

jquery post to get a json response load json response as data into datatable (array of objects)
jquery, register click event on
datatable rows when user clicks on row, need to get data object for row clicked on

My current code:

function contactSearchListTable(data) {
  // data is array of javascript object
  console.log('contactSearchListTable()');
  $(contactSearchResultsTableElement + ' tbody').off();
  if ( $.fn.dataTable.isDataTable(contactSearchResultsTableElement) ) {
    $(contactSearchResultsTableElement).DataTable().destroy();
  }
  if (data.length == 0) {
    $(contactSearchResultsTableElement).html('');
  }
  var table = $(contactSearchResultsTableElement);
  var params = {"data":data
                ,"info": false
                ,"searching": false
                ,"ordering": false
                ,"lengthChange": false
                ,"columns":[
                  {"data":"id","visible":false}
                  ,{"data":"name","title":"Name","class":"clickable"}
                  ,{"data":"phoneHome","title":"Home","class":"clickable"}
                  ,{"data":"phoneWork","title":"Work","class":"clickable"}
                  ]
                };
  var dt = table.dataTable(params);
  $(contactSearchResultsTableElement + ' tbody').on('click', 'tr', function () {
    console.log(this); // <tr> html from datatable
    // **** need to get hidden ID value here, HOW?
  } );
}

Gyrocode.com · Accepted Answer · 2015-04-30 19:53:32Z

3

You can access the data using row().data() function, change you click handler to:

$(contactSearchResultsTableElement + ' tbody').on('click', 'tr', function (){
   var data = dt.api().row(this).data();
});

answered Apr 30, 2015 at 19:53

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

user3720435 Over a year ago

Thanks, I'll try this. My previous attempts were missing the '.api()'. Did not realize that was needed.

SpoiledTechie.com Over a year ago

updated api from datatables doesn't require the api() anymore. I used: dt.row(this).data();

Gyrocode.com Over a year ago

@SpoiledTechie.com, if you use dataTable() to initialize the table as the original poster, it's required. Otherwise if you use DataTable() to initialize, it's not required.

SpoiledTechie.com Over a year ago

@Gyrocode.com your object dt says the table is already initialized. :) So if its already initialized, you don't need the dataTable() method. No biggie. Just letting everyone else know what I did.

Collectives™ on Stack Overflow

Get data object on row click

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related