Default tab by date or day I'm building a TV listing and I'm using quicktabs module with tabs:


Monday
Tuesday
Wednesday
Thursday
Friday
Saturday
Sunday


Every tab shows a node that have a TV listing.

Is it possible these tabs to be shown by date/day?

Example: today is Monday, so when a user enters the page for TV schedule the active tab will be Monday.

I've inspected the tab links and I find out that every tab has additional link to the main URL.

Example: The first tab (in mine case - Monday) has /program?qt-quicktabs_tv_schedule=0#qt-quicktabs_tv_schedule

The second tab (in my case - Tuesday) has /program?qt-quicktabs_tv_schedule=1#qt-quicktabs_tv_schedule

etc.

EDIT:

I've tried this code:

(function($){


$(document).ready(function(){
var d = new Date();
var n = d.getDay();
$(".quicktabs-tabs li").removeClass('active');
$('#quicktabs-tab-quicktabs_tv_schedule-0' + n).parent().addClass('active');


});
})(jQuery);


The removing active class is working, but the days changing based on 

var d = new Date();
var n = d.getDay();


it's not working. Maybe I'm missing something...

EDIT 2:

Here's what I've tried:

     (function($){


        $(document).ready(function(){
        var d = new Date();
        var n = d.getDay()-1;
        if ( n == -1) {
        n = 6;
        };

        $(".quicktabs-tabs li").removeClass('active');
        $('#quicktabs-tab-quicktabs_tv_schedule' + n).parent().addClass('active');
        $('.quicktabs-tabpage').addClass('quicktabs-hide');
        $('#quicktabs-tab-page-id-' + n).removeClass('quicktabs-hide');


        });

})(jQuery);


With this code it simply hides the default tab.
You can use javascript for this. 

Each quicktab "A" tag has an ID something like quicktabs-tab-name-0 (replace name with the quicktab name you have given) 

You can use some thing like the below code to get the current day of the week

var d = new Date();
var n = d.getDay();


this would return a number which would be something from 0 to 6 where 0 Represents Sunday and so on. 

The active class is set to li tag with in which the a tag is placed. 

So first we need to remove the active class from all the li with in quick tab this can be done with 

$(".quicktabs-tabs li").removeClass('active');


Next we need to add the active class to the current day's tab for which you could do something like.

$('#quicktabs-tab-name-' + n).parent().addClass('active');
// n is the day number we got from the code above. 


Next you need to enable the tab page for the corresponding tab for that you would do the following. The first one would add the hide class to all tab pages and the second code removes the hide class from the current div. 

$('.quicktabs-tabpage').addClass('quicktabs-hide');
$('#quicktabs-tab-page-id-' + n).removeClass('quicktabs-hide');


That should do it. 

Just make sure that the tabs are arranged form Sunday to Saturday. So that quicktab ids also get the same numbering. If you want a different order then you can offset the number accordingly by adding the offset value and then getting the reminder value of a division by 7. 

So in effect the complete code would be 

var d = new Date();
var n = d.getDay();
$(".quicktabs-tabs li").removeClass('active');
$('quicktabs-tab-name-' + n).parent().addClass('active');
$('.quicktabs-tabpage').addClass('quicktabs-hide');
$('#quicktabs-tab-page-id-' + n).removeClass('quicktabs-hide');


This would go inside the document ready function.