how to get the inner html value from Datatable cell

Question

I am newbie to DataTable. here I am trying to get the of first cell value of a row when I click the viewlink associated with the row, instead of the value I am getting [object object].

heres my code

        $(document).ready(function() {


            // Delete a record
            $('#example').on('click', 'a.editor_view', function (e) {
                e.preventDefault();
                var rowIndex = oTable.fnGetPosition( $(this).closest('tr')[0] );
                 aData = oTable.fnGetData($(this).parents('tr')[0]);
                alert(aData);
            } );

            // DataTables init

            var oTable=$('#example').dataTable( {
                "sDom": "Tfrtip",
                "sAjaxSource": "php/browsers.php",
                "aoColumns": [
                    { "mData": "browser" },
                    { "mData": "engine" },
                    { "mData": "platform" },
                    { "mData": "grade", "sClass": "center" },
                    {
                        "mData": null, 
                        "sClass": "center",
                        "sDefaultContent": '<a href="" class="editor_view">view</a> / <a href="" class="editor_remove">Delete</a>'
                    }
                ]
            } );
        } );

HTML Table:

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example" width="100%">
<thead>
    <tr>
        <th width="30%">Browser</th>
        <th width="20%">Rendering engine</th>
        <th width="20%">Platform(s)</th>
        <th width="14%">CSS grade</th>
        <th width="16%">Admin</th>
    </tr>
</thead>
<tfoot>
    <tr>
        <th>Browser</th>
        <th>Rendering engine</th>
        <th>Platform(s)</th>
        <th>CSS grade</th>
        <th>Admin</th>
    </tr>
</tfoot>

Now when I Click on the view I need to Navigate to another page with the id like view.php?id=125

Thank you

Answer 1

$('#example').on('click', 'a.editor_view', function (e) {
  e.preventDefault();
  var rowIndex = oTable.fnGetPosition( $(this).closest('tr')[0] );
  aData = oTable.fnGetData(rowIndex,0);
  alert(aData);
} );

From the api docs:

fnGetData Input parameters:
{int|node}: A TR row node, TD/TH cell node or an integer. If given as a TR node then the data source for the whole row will be returned. If given as a TD/TH cell node then iCol will be automatically calculated and the data for the cell returned. If given as an integer, then this is treated as the aoData internal data index for the row (see fnGetPosition) and the data for that row used.

{int}: Optional column index that you want the data of.

Answer 2

Assuming your first row is your id, would you want to include the links in your dataTable initializer like this?

$(document).ready(function () {
    var oTable = $('#example').dataTable({
        "aoColumnDefs": [{
            "fnRender": function (oObj) {
                var id = oObj.aData[0];
                var links = [
                    '<a href="/view.php?id=' + id + '" class="editor_view">View</a>',
                    '<a href="/delete.php?id=' + id + '" class="editor_remove">Delete</a>'];
                return links.join(' / ');
            },
                "sClass": "center",
            "aTargets": [4]
        }, {
            "sClass": "center",
            "aTargets": [3]
        }]
    });
});

see: http://jsfiddle.net/9De6w/