datatables jQuery plug-in get single column data and add to textarea

Question

I have a table of data using jQuerys datatables plug-in (awesome plug-in!!) and I need to have the data from the email column dynamicly added to a text area everytime the table is filtered or updated.

Can this be done? If yes then how?

I have looked through all the documentation on the website and cant find this.

Answer 1

You can probably start with the events live demo code. Their example shows timestamps getting appended to a textarea whenever the datatable is sorted, filtered, or paged. That sounds a lot like what you'd like to do:

http://datatables.net/release-datatables/examples/advanced_init/dt_events.html

function eventFired( type ) {
    var n = document.getElementById('demo_info');
    n.innerHTML += '<:div>:'+type+' event - '+new Date().getTime()+'<:/div>:';
    n.scrollTop = n.scrollHeight;      
}

$(document).ready(function() {
    $('#example')
        .bind('sort',   function () { eventFired( 'Sort' ); })
        .bind('filter', function () { eventFired( 'Filter' ); })
        .bind('page',   function () { eventFired( 'Page' ); })
        .dataTable();
} );

That should take care of your requirement to handle filtering. I'm not sure I understand the "updated" requirement, but if you are looking for a way to run the code when the datatable is live, this example may help:

http://datatables.net/release-datatables/examples/advanced_init/events_live.html

$('#example tbody tr').live('click', function () { ... });

Answer 2

I got this answer from Allan @ datatables:

Use fnDrawCallback to run a function that will fire whenever the table is updated. Then perhaps use fnGetData or the plug-in fnGetColumnData API methods to get the data and stick it into a text field using standard DOM / jQuery methods.

Allan

I followed this method to get the results I wanted.

Hope this helps others.

C