CODEWITHSUNDEEP
jqueryjquery-uidatatablesjquery-ui-tabs
Revenant
Revenant

Reputation: 2984

Jquery Datatables + Jquery Tabs = an is undefined error

I am using datatables inside of the jquery ui tabs. Everything works as expected, except one problem. I would like to trigger a click or select different tab depending on hash value of the url.

This is what I came up with 

$(document).ready(function() {
    var hash = window.location.hash;
    if (hash == '') hash = 'add';
    hash = hash.replace('#', '');
    $("a[href=#"+hash+"]").click();
});

This should do the trick normally but it didn't. an is undefined problem is hunting me for the last 7 hours.

I also tried different approach to solve the issue. For example instead of trying to use .trigger('click') or .click(), I decided to try with jQuery UI Tabs option, select;

$(document).ready(function() {
    var hash = window.location.hash;
    if (hash == '') hash = 'add';
    hash = hash.replace('#', '');

    i = 0;
    $('ul#tablinks li a').each(function() {
        href = $(this).attr('href');
        if (href === '#'+hash)  $( ".tabs" ).tabs("option", "selected", 2); 

        i = i + 1;
    });
});

No matter what I do it I touch anything on tabs menu, I get an is undefined for ( var i=0, iLen=an.length ; i<iLen ; i++ ) ... error.

Did anyone experienced similar problems with the datatables + jquery ui tabs or perhaps you have some advices...

Thank you for your time and concern in advance.

Upvotes: 1

Views: 1464

Answers (1)

Revenant
Revenant

Reputation: 2984

For some reason I find solution or way around after posting my problem on SOF. This question is just like others once again and my 'oh, c'omon now' reaction seems to be in a loop lately.

I'm using datatables with server-side processing. Which means data is loaded after the page itself is loaded. That's why for some reason $(document).ready(); wasn't providing expected result and I had to add extra time before it will do what I want so;

setTimeout(function () {
    var hash = window.location.hash;
    if (hash == '') hash = 'add';
    hash = hash.replace('#', '');
    $("a[href=#"+hash+"]").click();
}, 1000);

Did the trick. @David Thomas and @Scruffy The Janitor thank you for your time and concern.

Upvotes: 1

Related Questions