How do get data in row DataTable ?

headshot9x

Hello guys . I can not get data in row DataTable. I started with DataTable via ajax use Json string from webservice.See datatable debugger at http://debug.datatables.net/afejuj . I can load data Json into Datatable, and now i want to get data in row
in my page test.aspx

<table id="example" class="display">
            <thead>
                <tr>
                    <td>No</td>
                    <th>LOCATION_ID</th>
                    <th>AREA_ID</th>
                    <th>LOCATION_NAME</th>
                    <th>DES</th>
                    <th>DATE</th>
                    <th>BY</th>
                    <th>FLAG</th>
                </tr>
            </thead>
        </table>

And this is my script

     var table;
            table = $('#example').DataTable({
                "processing": false,
                "serverSide": false,
                "ajax": {
                    "url": "../BUS/WebService.asmx/ListLocation",
                    dataSrc: function (json) {
                        return $.parseJSON(json.d);
                    },
                    "dataType": "json",
                    "contentType": "application/json; charset=utf-8",
                    "type": "POST"
                },               
                "aoColumns": [   /// eight columns set with columns of table
                    { "mData": null },
                    { "mData": "LOCATION_ID" },
                    { "mData": "AREA_ID" },
                    { "mData": "LOCATION_NAME" },
                    { "mData": "LOCATION_DES" },
                    { "mData": "EDIT_DATE" },
                    { "mData": "EDIT_BY" },
                    { "mData": "FLAG" }
                ],             
                "columnDefs": [{   // define  first column , is column zero 
                    "searchable": false,
                    "orderable": false,
                    "targets": 0
                }],              
                "order": [[3, 'asc']]   /// sort at column three
            });
            table.on('order.dt search.dt', function () {
                table.column(0, { search: 'applied', order: 'applied' }).nodes().each(function (cell, i) {
                    cell.innerHTML = i + 1;
                });
            }).draw();
            table.column([1,2,5,6,7]).visible(false);   /// disabled column 1,2,5,6,7
            $('#example tbody').on('click', 'tr', function () {
                $(this).toggleClass('selected');   /// it work with selected
                var data = table.row($(this)).data();
                alert(data[1] + "  " + data[2]); ///not work , it error undefined and undefined
            });

Can you tell me about it and give me some advice. Thank, headshot9x

headshot9x

Dear guys, I try some days with google search for problem , but I can not work .
as same bellow work,it can get data at column 1 and 2

  alert($(this).find('td:eq(1)').html() + " and " + $(this).find('td:eq(2)').html());

but when i change

  alert($(this).find('td:eq(3)').html() + " and " + $(this).find('td:eq(4)').html());

it undefined because i have three column show. And try one time with get full data on row select as same

 $('#example tbody').on('click', 'tr', function () {
                alert( table.fnGetData($(this))); 
            });

But it just still no work . I see at https://datatables.net/forums/discussion/27151/how-do-i-get-access-the-columndefs#latest , i try with

alert(table.settings()[0].aoColumns[2].mData);

it show "AREA_ID" , which is setting in position 2 . but not data .
Please give me some advice.Thank, headshot9x

allan

$('#example tbody').on('click', 'tr', function () {
    console.log( table.row(this).data() );
});

Using the newer API ( row().data()) which is vastly more flexible than the old one.

Allan

headshot9x

Dear allan. Thank for your reply . Ago, I also studied via this link https://datatables.net/reference/api/row%28%29.data%28%29. I also tried but it does not show , it show error [object Object]

  $('#example tbody').on('click', 'tr', function () {
                alert(table.row(this).data());
            });

I think we should convert object to data ?, but I do not know how do it. I use Datatable 1.10.6 for this example.Ah, you should visit http://debug.datatables.net/afejuj order that to see the data as well as the method that I am using .
Thank you so much.

allan

alert will not show you the contents of complex objects, since it can only show strings. That is way I used console.log above. alert() is virtually useless in debugging applications.

Allan

headshot9x

Dear allan , I am so sory . Now , I can see it then open "Console" of Devtool GoogleChorme. I can see data after click a row in Datatable.

Object {LOCATION_ID: "L0006", AREA_ID: "A0003", LOCATION_NAME: "Huế", LOCATION_DES: "H", EDIT_DATE: "2014-11-05T00:00:00"…}
AREA_ID: "A0003"
EDIT_BY: "user 1"
EDIT_DATE: "2014-11-05T00:00:00"
FLAG: true
LOCATION_DES: "H"
LOCATION_ID: "L0006"
LOCATION_NAME: "Huế"
__proto__: Object

But but seems to it is an object . I want split it and get string data some of column. i.e value "L0006" at column "LOCATION_ID" . Can i get it ? Thank you.

allan

As you would do for any other object. Just use the LOCATION_ID property...

console.log(table.row(this).data().LOCATION_ID);

headshot9x

Okey. Thank allan . I just find away as using console.table. Convert them to table and get data at column console

console.table([table.row(this).data()], ["LOCATION_ID"]);