The purpose of this exercise was to find a way to auto-populate tab navigation for jQuery UI Tabs in a calendar-like format. This is particularly useful for any Drupal Views that are grouped according to field data.

I have a working demo of this idea here >> http://lab.atworkinthecloud.com/drupal-calendar-tabs/

I have implemented this code on a production site with no issues and would really like to see this bit of code in a Drupal module or something easier for the average drupaler to use, but I don't have the time (or the ability/inclination) to do that.

			$(document).ready(function(){

			    $('div.tab-body .title').each( function(i){
			    	var i = 0;
		            var Str = $(this).text();
		            var IDval = $(this).parent().attr("id");
		            
					if (Str == "<?php echo date('M'); ?>")
					  {
					  var li = '<li class="' + Str + ' ui-tabs-selected ui-state-active"><a href="#' + IDval + '">' + Str + '</a></li>';
					  }
					else
					  {
					  var li = '<li class="' + Str + '"><a href="#' + IDval + '">' + Str + '</a></li>';
					  }	            
		            
		            $('ul.tabs').append(li);
		        })
		    });    
		        	
			$(document).ready(function(){

				$('#tabs').tabs();
				
			});

Comments

dawehner’s picture

Component: page displays » Documentation

Lets move it.

By the way, this is not how it should be done. Tabs has it own fapi-like api.

ha5bro’s picture

What do you mean/what are you referring to? Quicktabs? Or Jquery UI? Please explain.

dawehner’s picture

Status: Needs work » Closed (won't fix)

The tabs module has a fapi like api.