dataTable() function not recognized by browser in jquery.datatables script

Question

I am creating a table in HTML5 using DataTables plugin for jQuery. The table is getting populated with a JSON object that is being received from the back-end web services.

Upon running the web application, the console displays an error saying,

Uncaught TypeError: Object [object Object] has no method 'dataTable'

in Google Chrome and a similar one in Firefox.

I am using the latest scripts for jQuery and jQuery DataTables. I have also tried creating DataTables on static tables and that works fine.

The dataTable() function is not being recognized in the scripts for a dynamically populated table.

The code for DataTables is as follows:

$(document).ready( function () {

    $('#datatable').dataTable( {

        "sScrollY": "200px",
        "bPaginate": false,
        "bProcessing": true

    } );
} );

datatable is the name of the table being populated.

Any help in solving this issue would be deeply appreciated.

Techie · Accepted Answer · 2012-12-19 05:05:50Z

2

There are a few things you can try to get this working.

Be sure your script is being pulled into the page, one way to check is by using the 'sources' tab in the Chrome Debugger and searching for the file else in the html head section
Be sure that you've included the datatale script after you've included jQuery, as it is most certainly dependant upon that.
Check whether jQuery is included properly and once only.
Watch out for jQuery conflicts. There is some other library which is overridding $, so your code is not working because $ is not an alias for jQuery anymore. You can use jQuery.noConflict() to avoid conflicts with other libraries on the page which use the same variable $.
"datatable is the name of the table being populated" <--- wrong table should have an id call 'datatable' according to your code $('#datatable').

answered Dec 19, 2012 at 5:05

Techie

45.2k45 gold badges164 silver badges248 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Ricardo Lohmann Over a year ago

The error means he got the element using jQuery. So the 2 one is the answer.

Techie Over a year ago

to be on the safe side I gave him couple of option, so that he can survive anyway :-)

user1519703 Over a year ago

I have looked at the sources tab and all the scripts are in place and are not being repeated. the jQuery is the first script to be imported.

Techie Over a year ago

check all 5 criterias. you might be able to fix it.

Doink · Accepted Answer · 2012-12-19 05:13:09Z

0

I think your $('#datatable').dataTable() gets called before the table is filled with the JSON object. I suggest adding dataTable() to the same place right after you filled the table.

answered Dec 19, 2012 at 5:13

Doink

1,1506 silver badges10 bronze badges

Collectives™ on Stack Overflow

dataTable() function not recognized by browser in jquery.datatables script

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related