call function on cell button click

crush123

in my datatable i have 2 rendered button links in each row, each to perform a specific function.

what i want to do is have an on click event for each button, so when each button is clicked, some of the row data is used in each function

i can retrieve the cell data ok

$('#example tbody').on('click', 'td', function () {

    var table = $('#example').DataTable();

    alert( table.cell( this ).data() );
)};

i can retrieve the row data ok

$('#example tbody').on('click', 'tr', function () {

    var table = $('#example').DataTable();

    alert( table.row( this ).data(); );
)};

using the example here http://editor.datatables.net/examples/simple/inTableControls.html

i have a function which fires on the click event of the button link

$('#example').on('click', 'a.ajaxresub', function (e) {
    e.preventDefault();

but can't work out a way to retrieve the row data

var data = $(this).closest('tr'); doesn;t return anything

crush123

worked it out (partially)

don't know if its the most elegant way, but...

changed the td tag in the table and added appropriate class name (eg ajaxresub)

then to retrieve the row data

$('#example').on('click', 'td.ajaxresub', function (e) {
    e.preventDefault();     
    var table = $('#example').DataTable();
    var data = table.row($(this).closest('tr')).data()
)};

i can then retrieve the contents of the cell I want. eg

var email = table.row($(this).closest('tr')).data()[1]

this works, but can't quite do what i want, which is to call ajax, and on success, update a particular cell value

the ajax works, but how do I (for example) update the value of table.row($(this).closest('tr')).data()[5] ?

allan

If you want to update a cell value, then use the cell().data() method. Something as simple as:

table.cell( $(this).closest('tr'), 5 ).data( .... );

should do it (assuming you update column data index 5 - modified as required if needed).

Allan

crush123

Thanks Allan. that's what I was looking for.

I can now update the cell value as I need.

What I am doing is on row update, setting the cell value, then applying the filter after a short delay.

    table.cell( $(this).closest('tr'), 5 ).data( '...' )
        setTimeout( function () {
            table.draw();
        }, 1000 );