How to get the row id of the selected row?

nazmul

Hi,

I am new to Datatables and also the a beginner at javascript.
I am trying to get the row id of the selected in a datatable. From the examples provided i have managed to make the row selectable and also add a highlight colour, but what i know need to is to get the row id, which i need to be able to update the row.

here is my code:


/*
"bSortable": true or false, this will show the sort icon, default is true
bSearchable": true or false, this will inlcude a column in the serach, default is true
bVisible": true or false, this will ensure whether a column is visible on load (hidden columns), default is false
*/
$(document).ready(function(){

// use this function to select a table row and pass values to input fileds in the dom
$('#tableLeads<?php echo $lead_type?>').click(function(event) {
$(oTable.fnSettings().aoData).each(function (){
$(this.nTr).removeClass('row_selected');


});
$(event.target.parentNode).addClass('row_selected');

var row = oTable.fnGetData(event.target.parentNode);
var newRow = row.toString();

var str = newRow.split("~~");


$('#delete').attr({
'onclick': "deleteLead('"+str[0]+"')",
'alt': "Delete Lead"
})


});

/* Add a click handler for the delete row */
$('#delete').click( function() {
var anSelected = fnGetSelected( oTable );
oTable.fnDeleteRow(anSelected[0]);
} );



var oTable = $('#tableLeads<?php echo $lead_type?>').dataTable( {
"sDom": "<'dtTables't>",
"oLanguage": {
//"sLengthMenu": "Show entries _MENU_",
"sProcessing": ""
},
//"bProcessing": true,
"bDeferRender": true,
"iDisplayLength": 50,
"bServerSide": true,

//"bStateSave": true, // use this
//"bPaginate": false, // disable pagination
//"bInfo": false, // hide the filtering text
//"bFilter": false // hide the serach field
"bRetrieve":true,
//"bDestroy": true,
"bScrollInfinite": true,
"bScrollCollapse": true,
"sScrollY": "650px",
//"sPaginationType": "full_numbers",
"sAjaxSource": "<?php echo plugin_absolute_url?>front-user-admin/enquiry/ajax-data-for-datatableLeads.php",
"fnServerParams": function ( aoData ) {
aoData.push( { "name": "lead_type", "value": "<?php echo $_GET['lead_type']?>" },{ "name": "user_type", "value": "<?php echo $_GET['user_type']?>" },{ "name": "year", "value": "<?php echo $_GET['year']?>" },{ "name": "month", "value": "<?php echo $_GET['month']?>" },{ "name": "prospect", "value": "<?php echo $_GET['prospect']?>" },{ "name": "appointments", "value": "<?php echo $_GET['appointments']?>" },{ "name": "date_leads", "value": "<?php echo $_GET['date_leads']?>" } );
},
"aaSorting": [[ 0, "desc" ]],
"aoColumns": [
/* db_row_id */ {"sWidth":"7%","bSearchable": false, "bVisible":false},
/* Date */ {"sWidth":"5%","bSearchable": false },
/* Age */ {"sWidth":"2%","bSearchable": false },
/* Method */ {"sWidth":"3%", "bSearchable": false },
/* Main Event */ {"sWidth":"5%","bSearchable": false },
/* Creator */ {"sWidth":"5%","bSearchable": false,"bSortable": false },
/* Name */ {"sWidth":"8%","bSearchable": true },
/* Number */ {"sWidth":"5%","bSearchable": true },
/* Email */ {"sWidth":"5%","bSearchable": true, "bVisible":false },
/* Events */ {"sWidth":"3%","bSearchable": false },
/* Status */ {"sWidth":"5%","bSearchable": false,"bSortable": false },
/* Assigned To */ {"sWidth":"7%","bSearchable": false,"bSortable": false },
/* View Edit */ {"sWidth":"3%","bSearchable": false,"bSortable": false },
/* Check box */ {"sWidth":"1%","bSearchable": false,"bSortable": false }
] ,


//"bJQueryUI": false,
"fnInitComplete": function(){
//$(".dtShowPer select").uniform();

/*$(".dataTables_filter input").addClass("simple_field").css({
"width": "auto",
"margin-left": "15px",
});*/

},

"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
var id = 'lead_'+aData[0];
$(nRow).attr("id",id);
return nRow;
}





})


/*$('#leads_search').keypress(function(){
oTable.fnFilter( $(this).val() );
})*/

$('#leads_search').keydown(function (e){
if(e.keyCode == 13){
oTable.fnFilter( $(this).val() );
}


oTable.$('tr').click( function () {
var data = oTable.fnGetData( this );
// ... do something with the array / object of data for the row
alert(data);
} );

})


})

// this function can be used to show hide columns dynamically
function fnShowHide( iCol )
{
/* Get the DataTables object again - this is not a recreation, just a get of the object */
var oTable = $('#tableLeads<?php echo $lead_type?>').dataTable();

var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
oTable.fnSetColumnVis( iCol, bVis ? false : true );
}

function fnClickAddRow() {
$('#tableLeads<?php echo $lead_type?> tbody').prepend('123456789101112');

}

function updateRow()
{
//$('#tableLeads<?php echo $lead_type?>').dataTable().fnUpdate( ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i','j','k','l',''], 2, 0,false);
var test = '123456789101112';
$('#lead_13').html(test);
}
/* Get the rows which are currently selected */
function fnGetSelected( oTableLocal )
{
var aReturn = new Array();
var aTrs = oTableLocal.fnGetNodes();

for ( var i=0 ; i

girishmr

Hope this helps

[code]
oTable=$('#example').dataTable();

var rowIndex = oTable.fnGetPosition($(this).closest('tr')[0]);
[/code]

nazmul

girishmr,

thank you for your prompt response.

That did the trick.

Thank you very much

girishmr

Glad it helped