“Uncaught TypeError: Cannot use 'in' opera

Question

I'm using the jQuery Datatables plugin to enable pagination, sorting and searching with my tables. The elements are showing up but not working, and the pagination only sometimes shows up. In Chrome console I'm getting the error:

Uncaught TypeError: Cannot use 'in' operator to search for 'length' in 

Here is the demo page.

I'm using Bootstrap alongside this plugin.

Answer 1

No need to downgrade jQuery. I solved the same error by using aoColumns as

$('#id').DataTable( {
    data: [["A", "B"], ["a", "b"]],
    'aoColumns': [ 
        { sWidth: "50%", bSearchable: false, bSortable: false }, 
        { sWidth: "50%", bSearchable: false, bSortable: false }
        ],
    } );

I am using jQuery 2.1.4 and DataTables 1.10.9

Answer 2

Whilst unrelated to DataTables, I came across this "cannot use in operator to search for length" error. This was the main Google result for the error so just wanted to post my issue as a response in case it helps anyone else.

I had:

ApplicationIDs: $.map(".application-checkbox:checked", function (checkedApplicationCheckbox, i) {

I'd forgotten to wrap my selector with the $ so the fix was to make sure I was passing the actual jQuery elements as the first argument to map and not just a string...

ApplicationIDs: $.map($(".application-checkbox:checked"), function (checkedApplicationCheckbox, i) {

I'm almost embarrased to post this ;)

Cheers

Answer 3

That error is because of the method isArraylike in jQuery version 1.11.3. (only). The method looks like this

function isArraylike( obj ) {

    // Support: iOS 8.2 (not reproducible in simulator)
    // `in` check used to prevent JIT error (gh-2145)
    // hasOwn isn't used here due to false negatives
    // regarding Nodelist length in IE
    var length = "length" in obj && obj.length, // <------ THIS IS THE CULPRIT
        type = jQuery.type( obj );

    .......
}

That version of jQuery was using "length" in object to get the length. (I do not know anything about it).

But I do know that no other versions of jquery have that issue.

The versions 1.11.3 and 2.1.4 (as James pointed out in the comments) have this issue.

So the solution would be to just upgrade to the next version or at least use any other version apart from 1.11.3 or 2.1.4

Answer 4

Upgrading to DataTables to DataTables 1.10.7 or 1.10.8-dev did not work for me (using jQuery 1.11.3).

Downgrading to jQuery 1.11.2 did work (using DataTables 10.0.0)

Answer 5

I had this exact same issue but jQuery version was not the culprit for me. In my case, I was incorrectly serializing the form. The code ended up with this error was:

$('#form_name').serialize()

Whereas I should have used.

$('#form_name').serializeArray()

I did this and my issue was resolved.

Just throwing out this little piece that I ignored. Could help someone out there.

Answer 6

With DataTables and calling a PHP-script with AJAX, be aware that you just must echo your array at the end. There is no need of encoding it first to a JSON object with json_encode.

So

header('Content-type:application/json;charset=utf-8'); 
echo $myArray // This will do. Do not use echo json_encode($myArray);
exit();

Otherwise you might end up with the dreadful error

Uncaught TypeError: Cannot use 'in' operator to search for 'length' in

or this one

Uncaught TypeError: Cannot read property 'length' of undefined