datatable.fnDraw() is not a function

Question

I have a datatable which is being populated and displayed as I wish. There is a date column that I could like to apply a date range filter to. There are two controls on my HTML page that I have given id's to and added the datepicker jquery to . I've looked at the code example given here https://datatables.net/plug-ins/filtering/row-based/range_dates but when I run the code a and change the date on the control I see an error that oTable.draw() is not a function.

I'm using datatables 1.10.11 and I've set my table up using the following code

var statementTable = $('#statementTable').DataTable({....});

The on change event is being trigger with this line

$('#startdatepicker').change(function () { statementTable.fnDraw(); });

When this line executes I see the error in the console:

statementTable.fnDraw() is not a function.

Can anyone offer any pointers please? Thanks Richard

Answer 1

Method fnDraw() is older API method for DataTables 1.9.

For newer DataTables 1.10+ when you initialize table with DataTable() , use newer draw() API method instead.

$('#startdatepicker').change(function () { statementTable.draw(); });

Alternatively you can initialize your table with dataTable() , then older API methods such as fnDraw() would still work.

Answer 2

This was caused by the declaration of the statementTable being in the wrong place so not available to the wider context. See the comments below the original post.