Hi,
I was wondering if it would be possible to save which tab was last open for a user and bring that tab up immediately when navigating to a page that has the quick tab block.

Thanks.

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

monsterweb’s picture

Version: 5.x-1.x-dev » 6.x-2.0-rc1
Category: feature » support

Hello,

I thought I would bump this request. I have been trying to do something similar. I'm trying to have the tabs 'save' the active tab when navigating to a story so that a user can keep that tab active when clicking through articles on the tab.

I labeled this as a support request, really I just wanted some pointers from a developer who's more experienced with this module on how to implement this.

Thanks,
Monsterweb

Pasqualle’s picture

in 6.x-2.0 you can open any tab if you use this format:

http://example.com/mypage?quicktabs_42=2

where 42 is the qtid (quicktab id) and 2 is the tabpage id (normally 0 is the first tabpage). so if you add this parameter to the links then the selected tab will be opened.
if you want to automatically scroll down to the quicktab you can use:

http://example.com/mypage?quicktabs_42=2#quicktabs-42

for 5.x-1.x I do not have a solution..

rsmith5’s picture

I was thinking more along the lines of saving the last clicked tab in the $_SESSION variable. Seems like it would be fairly straight-forward to implement since you already have it working for taking the argument from the url bar.

drupalok’s picture

subscribing! this would be a wonderful feature... otherwise one always has to click back to the tab, when going through the different nodes.
thank you!

sidal1’s picture

Hello,

What do you mean by 'one has to click back to the tab, when going through the different nodes' ?

Right now I am trying to provide a way to go through different nodes under a tab. I have 2 tabs with views in them. When users click a node inside a view, I want to show the Full Node inside current tab. But currently when user clicks a node in a view, it goes to that Node's page and completely leaves the tabbed page. Do you know how we can go through different nodes of a view under the same tab?

Thanks a lot!

EkaMei’s picture

Basically, what they meant is that when someone click on a tab in a page that have quicktab. Then they navigates away from that page, and then click the "Back" button to return to the page where they clicked a quicktab last. It should remember the status of the quicktab and restores it as if they didn't navigates away from that page. Rather then jumping back to the default tab.

This is more of a usability issue, but I agree it is a good one.

Pasqualle’s picture

The quicktabs module has no control about the content of your tabpages. It does not know about the links what you have inside it. The links inside the quicktab are absolutely the same as outside the quicktab.

You need to format your links (inside the tabpage) to achieve the desired functionality. The format is described in comment #2.

It is not possible to store every active tabpage in the SESSION variable, because (1) you may use more quicktabs on the same page, and (2) I do not know when this information should be cleared..

When users click a node inside a view, I want to show the Full Node inside current tab.

this is much more than quicktabs module is capable of, sorry.. You may open a new feature request, but I have no idea how should I do that.. Maybe it is possible with Panels module, but I am not sure..

drupalok’s picture

@Pascalle

Dont get me wrong, I really love this module, it's one of the best I've seen, but without remembering the last clicked TAB the practical use of it is very limited. I just cant expect my clients / users to click back to the TAB they've been, every time they go through - let's say - several FAQs on the website which are located in a third TAB.
is there any automated way i can add the ?quicktabs_42=2 (example from comment #2) to my links in the TABs?

thank you very much!

rsmith5’s picture

It is not possible to store every active tabpage in the SESSION variable, because (1) you may use more quicktabs on the same page, and (2) I do not know when this information should be cleared..

(1) If you use an associative array in the SESSION variable, and key it based on the quicktab id, you can store which tab is clicked across the entire site, independent of how many are on a page.

(2) I believe the SESSION variable is stored per user in the databases, and cleared automatically upon logout. You shouldn't even need to worry about it.

Flying Drupalist’s picture

@drupalok, that's not how you're supposed to use quicktabs. For main page content create tabs in theme. The quicktab urls would not be SEO friendly anyway.

sidal1’s picture

Hi,

Do you have any code sample which does number 1?

Thanks!

rsmith5’s picture

There would need to be an event listener (probably with javascript) that sent out a POST when a tab was clicked. The POST would include the quicktab-id and which tab was clicked. The POST would fire a php function that did something like:
$_SESSION += array( $quicktab_id => $clicked_tab );
Then, whenever a page was loaded there would be something like:

if($_SESSION[$this_quicktab_id]){
  $clicked_tab = $_SESSION[$this_quicktab_id];
}
WorldFallz’s picture

Just an fyi comment: I was assisting someone with trying to locate this functionality and noticed that magic_tabs lists it as a feature so it can definitely be done. Perhaps a look at how it's done there would be helpful.

Pasqualle’s picture

Version: 6.x-2.0-rc1 » 6.x-2.x-dev
Category: support » feature

changing to feature request. Keeping the version for now, but most probably it won't be fixed within 2.x

this is a duplicate of #248798: Tab reset with page load., but let's keep both issues open as there is some discussion in both..

Flying Drupalist’s picture

mmader’s picture

I came up with a quick and dirty fix for this, thanks to Flying Drupalist's suggestion of using cookies.

In quicktabs.js

var quicktabsClick = function() {

  var tab = new Drupal.quicktabs.tab(this);

  // Set clicked tab to active.
  $(this).parents('li').siblings().removeClass('active');
  $(this).parents('li').addClass('active');


  //add cookie for active qtab                                                              ***add these lines***
  var active_tab_id = this.id.split('-')[3];	     //active tab Id number
  var qtid = this.id.split('-')[2];	                     //quicktab Id number
  document.cookie = "quicktabs" + qtid + "=" + active_tab_id + "; path=/"; //create cookie for quicktab


  // Hide all tabpages.
  tab.container.children().hide();
. . .

and in quicktabs.module

function _quicktabs_get_active_tab($quicktabs) {
  $active_tab = isset($_COOKIE['quicktabs' . $quicktabs['qtid']]) ? $_COOKIE['quicktabs' . $quicktabs['qtid']] : key($quicktabs['tabs']); //check cookie for active tab***add this line***
  $active_tab2 = isset($_GET['quicktabs_' . $quicktabs['qtid']]) ? $_GET['quicktabs_' . $quicktabs['qtid']] : $active_tab;  //check for args after cookies to override cookies***change this line***
  if (isset($active_tab2) && isset($quicktabs['tabs'][$active_tab2])) {                          ***change to $active_tab2***
    return $active_tab2;
  }
  return NULL;
}

When a tab is clicked, it saves or changes a cookie that represents that quicktab's current state. When quicktab renders the page, it checks the cookie for the active tab number, if there is one. So simple and yet works well enough for my needs. If the same tab is printed on multiple pages, they'll all have the same active tab because the cookie is based on the qtid.
I'm surprised it took a year until someone came up with a solution. This is kind of an important feature, if only to keep your customers happy when they're using a pager on the second tab, which of course refreshes the page back to the first tab.

Pasqualle’s picture

using a pager on the second tab, which of course refreshes the page back to the first tab

if it is an ajax view, then the pager does not reload the page..

ospinto’s picture

mmader's solution works. if you'd rather use SESSIONS, see below:

Create a php page in your drupal root which will set the session.
Example /qt_session_set.php with the following code:

include('./includes/bootstrap.inc');
drupal_bootstrap(DRUPAL_BOOTSTRAP_FULL);
if(array_key_exists('qt_index',$_GET) && array_key_exists('qt_id',$_GET))
	$_SESSION[str_replace('-','_',$_GET['qt_id'])] = $_GET['qt_index'];

In your page.tpl.php have this jQuery function:

$(document).ready(function() {
  //set session cookie
			$('a.qt_tab').click(function(e) {
				var qt_parent_id = $(this).parents('.quicktabs_wrapper')[0].id;
				var qt_index = this.id.split('-')[3];
				jQuery.get('<?php print $base_path; ?>/qt_session_set.php', {'qt_id':qt_parent_id, 'qt_index':qt_index});
			})
});

And then finally in the quicktabs.module file, in the _quicktabs_get_active_tab function, change the line that says:

$active_tab = isset($_GET['quicktabs_'. $quicktabs['qtid']]) ? $_GET['quicktabs_'. $quicktabs['qtid']] : key($quicktabs['tabs']);

TO:

	if($_SESSION['quicktabs_'.$quicktabs['qtid']])
		$active_tab = $_SESSION['quicktabs_'.$quicktabs['qtid']];
	else if(isset($_GET['quicktabs_'. $quicktabs['qtid']]))
		$_GET['quicktabs_'. $quicktabs['qtid']];
	else
		key($quicktabs['tabs']);
 

VOILA!

vertikal.dk’s picture

ospinto,

Excellet solution. Your code didn't work perfectly for me, so I changed a few things.

I used cookies in stead of sessions, so my PHP-file qt_session_set.php in the root looks like this

<?php
include('./includes/bootstrap.inc');
drupal_bootstrap(DRUPAL_BOOTSTRAP_FULL);
if(array_key_exists('qt_index',$_GET) && array_key_exists('qt_id',$_GET))
    setcookie(str_replace('-','_',$_GET['qt_id']), $_GET['qt_index']);
?>

I put my JavaScript in the bottom of page.tpl.php and it is basically the same as yours, but I removed the slash before the file name to avoid double slashes, which made it fail here:

<script>
$(document).ready(function() {
  //set cookie
  $('a.qt_tab').click(function(e) {
    var qt_parent_id = $(this).parents('.quicktabs_wrapper')[0].id;
    var qt_index = this.id.split('-')[3];
    jQuery.get('<?php print $base_path; ?>qt_session_set.php', {'qt_id':qt_parent_id, 'qt_index':qt_index});
  })
});
</script>

My new _quicktabs_get_active_tab function for quicktabs.module looks like this:

<?php
/**
 * Helper function to determine active tab from the url.
 */
function _quicktabs_get_active_tab($quicktabs) {
    if(isset($_GET['quicktabs_'. $quicktabs['qtid']]))
        $active_tab = $_GET['quicktabs_'. $quicktabs['qtid']];
    else if($_COOKIE['quicktabs_'.$quicktabs['qtid']])
        $active_tab = $_COOKIE['quicktabs_'.$quicktabs['qtid']];
    else
        key($quicktabs['tabs']);

  if (isset($active_tab) && isset($quicktabs['tabs'][$active_tab])) {
    return $active_tab;
  }
  return NULL;
}
?>

I have the $_GET-element before the $_COOKIE-element to enable controlling the tab via the URL even if the cookie is set. I also made a couple of other small adjustments.

This would be a great function to have in the module. A simple checkbox in the setup of each QuickTab could decide whether the single QuickTab should "remember" its tab or not, and the setting of the cookie could be fully enclosed in a small JavaScript-file, which could be included by the module. That would avoid the separate PHP-file in the root, and leave everything to the module.

Even without this, this is a great module! It has saved me a lot of work on a project, so thanks to all who contributed!

Martin

EkaMei’s picture

I agree, this is a great module. I still hesitates to add this remember tab function since it is not verified but it is certainly worth considering.

In my opinion, it appear that using cookie is probably a better choice. Session might be nice but it would probably create extra query that might not be necessary

tayzlor’s picture

is there a patch available which incorporates all of the above code (in #16, #18 and #19) into a working solution?

jpdaut’s picture

Version: 6.x-2.x-dev » 5.x-1.4

Has anyone done this for QT for Drupal 5?

jannalexx’s picture

#16 works ok only on non cached pages, this makes it useless at the time being, does anyone knows how to make it work with cached content? for anonymous and authenticated users.
it worked after clearing, disabling and enabling again drupal core cache

#19 produces empty tabs for me

colapsiblock module http://drupal.org/project/collapsiblock remembers last state correctly, just for reference

jannalexx’s picture

Version: 5.x-1.4 » 6.x-2.x-dev
yitznewton’s picture

All-Javascript patch, inspired by JQueryUI Tabs; tested with non-AJAX tabs:

--- modules/quicktabs/js/quicktabs.js	(revision 17)
+++ modules/quicktabs/js/quicktabs.js	(working copy)
@@ -24,7 +24,21 @@
   // Search for the active tab.
   var $active_tab = $(el).children('.quicktabs_tabs').find('li.active a');
 
-  if ($active_tab.hasClass('qt_tab') || $active_tab.hasClass('qt_ajax_tab')) {
+  // recall state
+  var cookie_name  = "quicktabs" + qtid;
+  var cookie_start = document.cookie.indexOf( cookie_name + "=" );
+  var cookie_end   = document.cookie.indexOf( ";", cookie_start );
+  if (
+    document.cookie.length > 0
+    && cookie_start != -1
+    && cookie_end   != -1
+  ) {
+    cookie_start  = cookie_start + cookie_name.length + 1;
+    active_tab    = document.cookie.substring( cookie_start,cookie_end );
+    var active_id = "quicktabs-tab-" + qtid + "-" + active_tab;
+    $(el).children('.quicktabs_tabs').find("a#" + active_id).trigger('click');
+  }
+  else if ($active_tab.hasClass('qt_tab') || $active_tab.hasClass('qt_ajax_tab')) {
     $active_tab.trigger('click');
   }
   else {
@@ -144,6 +158,11 @@
   $(this).parents('li').siblings().removeClass('active');
   $(this).parents('li').addClass('active');
 
+  // store state
+  var active_tab_id = this.id.split('-')[3];
+  var qtid          = this.id.split('-')[2];
+  document.cookie = "quicktabs" + qtid + "=" + active_tab_id + "; path=/";
+  
   // Hide all tabpages.
   tab.container.children().hide();

Mixologic’s picture

Yitzchas Javascript worked perfectly for me.

I have a custom cck node add/edit form embedded in the third tab (a thorough survey for the content).
Upon submission of invalid data/incomplete form, the page would reload and the first tab would be selected.. now everything works how I want it to! awesome!

This is definitely something that should be incorporated into quicktabs (with current behavior the default of course).

ShannonK’s picture

yitzchas -

Could you tell me how to implement this javascript code? I'm not sure where I need to put it and if I copy the whole thing verbatim or not.

Any help would be greatly appreciated!

ShannonK

volocuga’s picture

ShannonK: quicktabs.js file

fastballweb’s picture

I'm real late to this discussion, but ...

Couldn't this be possible by just turning off the onclick behavior of the tabs? It's already got the right url in the link, but currently the javascript intercepts it and just flips the content that's showing.

This is nifty for lightning quick loading, but makes things unnecessarily complicated if you're using QT to help users get other places ... as others have mentioned, it's not acceptable to have users lose their last clicked tab when they return to the quicktab with their back button.

But if the JavaScript is turned off, there's no need to mess with any of this. To give it a whirl, just middle-click the tab instead of right-clicking, to open it in a new browser tab. The new tab will have a nifty url that the user can return to later with the back button.

So it seems to me that turning off the JS would be a useful option to have. In fact, I'd even go so far as to say that this should be the default behavior if using non-AJAX tabs. But then again I don't fully understand why the option is there in the first place, so I'll leave that up to people more familiar with the module.

Being able to turn off the JS seems like a no-brainer to me though.

In fact I just tried it and it works beautifully for me. I'm not able to whip up a fancy patch that adds this as an option (for the moment), but if you're desperate like me and want to give it a shot, just comment out line 22 of the quicktabs.js file.

ShannonK’s picture

My line 22 is this: });

Can you tell me what the line says that I should comment out?

Thanks in advance!

bryancasler’s picture

Subscribe

fastballweb’s picture

Wow, that was pretty un-helpful, wasn't it?

The line you should comment out looks like this:

$(this).bind('click', quicktabsClick);

Essentially you are disabling all of the JavaScript functionality of the module by doing this. But I think that makes sense for some users.

ShannonK’s picture

Hmm. I commented out the line you stated, but this isn't functioning like I thought it would. If I have three tabs, Bananas, Apples, Oranges, and I click on Oranges and leave a comment, as soon as I click Save it takes me to the node page itself, not the tab. I hit the Back arrow of my browser to get back to the tabs, and I'm taken to the first tab, Bananas again. I would think upon clicking the back arrow it should bring me back to Oranges.

Better yet would be to never leave the tabs (rather than ending up at the node), but that doesn't seem to be possible. I wonder if there's another module that would work better for this?

varunity’s picture

ShannonK, there are some techniques for redirecting forms here: http://drupal.org/node/134000

fastballweb's suggestion works as expected for me. It would be nice to solve this with javascript but this will have to work in the mean time. Thanks!

smubzi’s picture

fastballweb -

This works for me, but when i click on the tab the page scroll down to the tab area, is there that it will start at the top of the page.

Thanks!

fastballweb’s picture

smubzi-

I've had a request to do this on my end also...I will let you know if I come up with anything, but I have a feeling it will become a lot more complicated than just commenting out a single line, and I don't really know how to make patches yet.

pribeh’s picture

subscribing.

thaddeusmt’s picture

I tried #25 and couldn't get it to work, but the solution in #19 worked like a charm!

Unrelated, perhaps, but has anyone figured out how to not only remember which tab was last viewed, but which AJAX View Page in that tab?

Cheers

RikiB’s picture

#25 worked for me with 2x but #19 would not work.

L0rne’s picture

#25 worked great for me (thanks, yitzchas), but only after I took out the cookie_end stuff. For some reason, the information I wanted was at the end of the cookie file, and had no semi-colon at the end. I hope this information will help someone else.

	&& cookie_start != -1
	//&& cookie_end   != -1

and

	//active_tab    = document.cookie.substring( cookie_start,cookie_end );
	active_tab    = document.cookie.substring( cookie_start ); // took out cookie_end because the cookie was not being retreived

L0rne’s picture

I had to change my modifications to make them more flexible; I added another quicktab block, which meant my first one needed the cookie_end, but the second one did not need cookie_end. So I replaced


    //active_tab    = document.cookie.substring( cookie_start,cookie_end );
    active_tab    = document.cookie.substring( cookie_start ); // took out cookie_end because the cookie was not being retreived

with

	if ( cookie_end == -1 ) {
		active_tab    = document.cookie.substring( cookie_start ); // took out cookie_end because the cookie was not being retreived - L0rne
	} else {
		active_tab    = document.cookie.substring( cookie_start,cookie_end );
	}
    
TimAlsop’s picture

Has this patch been put into dev release yet ? I hope it gets eventually put into 2.0 release.

ishanmahajan’s picture

Thanks yitzchas, solution at #25 worked perfectly for me. I am using multistep forms in some of the tabs.
hope this feature gets incorporated in the next release.

maria_zk’s picture

+1 Request as in #38, remember the ajax page when using views that provide pagination.

eneko1907’s picture

Well, I tried unsuccessfully both approaches #19, and #25 (with the #41 notes, and even disabling Js as noted in other comment). I am using a essentially the same views filtered by one CCK value, which give me the many tabs. It renders beautifully, but as soon as I click on a node title (the only field in any of the tabs views) it forgets the tab that I was at, and resets to the first tab (the default tab). This is a show stopper from the usability point of view, otherwise a great module -thanks.

Sure, my D6 instance is not vanilla, tons of modules and using advance theming (aquia marina+skinr) - it could be that. Will update if I try on any of these pseudo patches on a vanilla install

thanks, Inigo

Andrew Gorokhovets’s picture

subscribing! this would be a wonderful feature...

Andrew Gorokhovets’s picture

To #45
The same problem. Has tried all.

seancorrales’s picture

Using Quicktabs 6.x-2.0-rc5 and the code provided in #16, I was successfully able to modify the module to remember the last clicked tab. Like #45, I had no luck with #25. Didn't even try #19.

yngens’s picture

Version: 6.x-2.x-dev » 6.x-3.x-dev

Unfortunately, already 6.x-3.x branch has been released and this so much desired by many feature has not been committed. I have tried all the mentioned methods and could not get it working for 6.x-3.x. Could anyone?

petergus’s picture

it totally crashed my site, but that could be me putting code in wrong place.
would also be happy to hear if someone made this in v3!
that javascript part @ #19, that goes in the main page.tpl or must a new page-nid.tpl be made for the page with the QT?

and i noticed in the QT module (3.x dev) theres some code about active tab.

*confused* but will keep trying to get this implemented, success stories are inspiring ;)

petergus’s picture

@16 does not work for me (3.x dev)

Renee S’s picture

Fix #25 worked for me with Quicktabs 3.x. Thanks a million =)

mansspams’s picture

Fix #25 worked for me with Quicktabs 3.x too. Just see if your browser accepts cookies.

duntuk’s picture

#25 patch works on quicktabs 3.x . Thanks!

mansspams’s picture

#25 works but it does NOT respect URL query :( Cookies should work only if there is no url query or else there is no way to link to particular tab, you always get latest viewed tab.

UPDATE: ended up adding custom hash # after link to tab and new js code to switch to needed tab and removing hash :( this module needs to swithc to hashes only, queries cannot be manipulated with js.

math-hew’s picture

Just chiming in to confirm that #25 worked for me in 3.x too. Would be great to see this added to the module as an option in the UI.

tbenice’s picture

#25 worked for me on 6.x-2.0-rc5

ununpentium’s picture

When running the patch in #25, I'm getting the following error:
**** malformed patch at line 4: ?? // Search for the active tab.

Instead of having to cut & paste the patch, can an authentic patch file (of #25) be attached to this thread?

tbenice’s picture

Update: #25 worked for me in chrome (webkit) but not Firefox. Browser accepts cookies so that's not the problem I'm going to try #41 and see if that helps...more later

EDIT: #41 seemed to do the trick for firefox.

martinfer’s picture

can you publish some solution in a module (or files)? I need this function, but I cant do it. Thanks

guysung’s picture

#25 along with #41 just works for me.
It will be nice that next release include this feature.
Thanks much.

jason.fisher’s picture

JS only solution -- this enables tab memory for the quicktab div with id="quicktabs-5". The current path is used in the key, so the tab memory is on a per-page basis. The effect isn't instantaneous/pre-render with this method, but it worked for our needs.

$(document).ready(function() {

  // get the path for cookie granularity
  var pathname = window.location.pathname;

  // enable tab memory for quicktabs-5
  var tablocator = 'quicktabs-5';
  var tab = $.cookie(pathname + tablocator);
  if (tab != "") $("div#"+tablocator+" ul.quicktabs_tabs a#"+tab).click();
  $("div#"+tablocator+" ul.quicktabs_tabs a").click(function() { $.cookie(pathname + tablocator, $(this).attr('id')); });
});
kevstav13’s picture

Does this overwrite the page.tpl.php file code found in #19, or is it something separate and we don't need any other code? If we don't need any other code, where does your code go?

Edit: I've tried your code with it in the page.tpl.php, both with and without the code from #19 and can't get it working. I really need your page-based version, not the qtid versions.

Thanks!

Macronomicus’s picture

Yay #62 that was simple.

@Kevstav13 you can put it a lot of places but try the page.tpl, also make sure to replace 'quiqktabs-5' with the id of your quicktab.

I might be nice to do this for all quicktabs on the site instead of adding the #id var manually. Couldn't we use the .quicktabs_wrapper ? or is there some good reason not to do this automatically for all quicktabs?

EDIT: Indeed using the class instead of the id seemed to work better in my situation, so I dont have to enter in the various id's.

$(document).ready(function() {

  // get the path for cookie granularity
  var pathname = window.location.pathname;

  // enable tab memory for all quicktabs
  var tablocator = 'quicktabs_wrapper';
  var tab = $.cookie(pathname + tablocator);
  if (tab != "") $("div."+tablocator+" ul.quicktabs_tabs a#"+tab).click();
  $("div."+tablocator+" ul.quicktabs_tabs a").click(function() { $.cookie(pathname + tablocator, $(this).attr('id')); });
});
   	
   

Cheers!

kevstav13’s picture

I've tried the #62/#64 code in page.tpl.php with both versions 6.x.2.0-rc5 and 6.x.2.0, to no avail. Does this only work with the 6.x.3 branch? I'd like to know before going through the upgrade process to 6.x.3.0.

To be more precise about what I've been doing, I added only that code, and nothing else from previous comments in this thread. I put your code inside script tags in my page.tpl.php file inside my custom theme. I did notice that there was already a script for quicktabs in the page.tpl.php file but it was different from yours. I've tried using your code both with and without the already-present script in page.tpl.php.

Thanks in advance.

kgeographer’s picture

subscribing

Macronomicus’s picture

@Kevstav13 Yes this is the 3.x branch, im not sure about the older branch, may not work.

I put that code from #64 into my page.tpl, in the head, though you could just as easily add it to your sites script.js too as a "drupal behavior". Something along these lines should also work, though ive not tested it.

Drupal.behaviors.moBetterQuicktabs= function (context) {
  var pathname = window.location.pathname;

  // enable tab memory for ALL quicktabs
  var tablocator = 'quicktabs_wrapper';
  var tab = $.cookie(pathname + tablocator);
  if (tab != "") $("div."+tablocator+" ul.quicktabs_tabs a#"+tab).click();
  $("div."+tablocator+" ul.quicktabs_tabs a").click(function() { $.cookie(pathname + tablocator, $(this).attr('id')); });


};

It should work but YMMV, could be your server setup getting in the way too.

Cheers!

kgeographer’s picture

The javascript in #25 plus #41 worked for me, very grateful!!

But...as mentioned in #55, the session setting does not get overridden by a URL as in #2. This is an important (though not critical) UX issue as returning to tab 0 from the main menu option for example is what users would expect -- in my case anyway.

So @mansspams, could you share the js fix you did?

Macronomicus’s picture

@kgeographer

"UX issue as returning to tab 0 from the main menu option for example is what users would expect"

The point here is to "remember" where they were on last view and present that instead. You could leave the module as is if you'd like it to reset to the first tab.

kgeographer’s picture

@macrocosm

In my application the ideal would be that re-selecting the primary menu item that brings you to the quicktabs page/panel erases memory of last tab position, effectively a reset. But while the user is navigating content my quicktabs navlist is serving, remembering the last is essential. Yes, that's 'having your cake and eating it.'

Your crack about 'leave it as is' is unnecessarily snarky. Obviously I require the functionality labored over here, that's why I said I was grateful. There are many use cases in the world.

sserg’s picture

Version: 6.x-3.x-dev » 7.x-3.0
Priority: Normal » Critical

Hello )
Is there a solution for d7 ?

WorldFallz’s picture

Version: 7.x-3.0 » 6.x-3.x-dev
Priority: Critical » Normal

Please don't change the status and version unless you know what you're doing. This is not critical and all the suggestions in this thread are for d6 and may not work for d7.

sserg’s picture

ok ? sorry about that .. i'm first time here ...

sserg’s picture

but what about solution for d7 ?

sserg’s picture

Since there is no better solution for D7 , I'm decided to use this in my page.tpl.php at the end of a php code :

 
(function($){
 $('a#quicktabs-tab-quicktab-0').click(function() {
          $.cookie('the_id', '0');
        })
 $('a#quicktabs-tab-quicktab-1').click(function() {
          $.cookie('the_id', '1');
        })
 $('a#quicktabs-tab-quicktab-2').click(function() {
          $.cookie('the_id', '2');
        })
 $('a#quicktabs-tab-quicktab-3').click(function() {
          $.cookie('the_id', '3');
        })
 $('a#quicktabs-tab-quicktab-4').click(function() {
          $.cookie('the_id', '4');
        })
 id = $.cookie('the_id');
$(document).ready(function() {
 $('a#quicktabs-tab-quicktab-'+ id).click()
 $.cookie('the_id', null);
});
})(jQuery);

I'm not an expert in jquery , so i didn't try cycles and for each link wrote an id manualy... Hope somebody will make my code more better ...

mansspams’s picture

#40 & #41 Posted by L0rne worked for me. There were additional problem of directing to tab from search results and I cannot find how I did it, still looking. Meanwhile, here is an issue I think would help to resolve this... #1056996: use only hash for direct links to tab

Ahh, it was ugly hack to Search By Page module is how I got search results to direct to correct open tab.

jason.fisher’s picture

I use this snippet in a separate .js file that I include in a custom module. It could be included in page.tpl.php or the theme ..

One thing to keep in mind is that $.cookie is used. JQuery Cookies come with D7, but with D6 you need to include it yourself. It looks like I am getting it from the text_resize module.

chinita7’s picture

Sorry for my newbie question..
In which file can I put the code from #41?

weseze’s picture

Sugested code in #67 works perfectly. Can this be included in the next release? Maybe with a checkbox in the settings to activate it?

Surabhi’s picture

Version: 6.x-3.x-dev » 7.x-3.2

How can I achieve this in drupal 7.

drupalok’s picture

Version: 7.x-3.2 » 6.x-3.x-dev

please don't change the Version number of this thread... it deals about Drupal 6

tim.plunkett’s picture

Is this something the maintainers would want added to the module itself? I can try to roll a patch for it.

chinita7’s picture

Just wanna say thanks. #67 worked for me. I put exactly the same code in the head of tpl.php file.

Samgarr’s picture

Dont work for me:( You just copy&paste snippet from #67?

chinita7’s picture

Yes I put the exactly the same code from #67 between <head> and </head> with <script> tag just like bellow. I use 6.30 version.

<script type="text/javascript">
<!--
Drupal.behaviors.moBetterQuicktabs= function (context) {
  var pathname = window.location.pathname;

  // enable tab memory for ALL quicktabs
  var tablocator = 'quicktabs_wrapper';
  var tab = $.cookie(pathname + tablocator);
  if (tab != "") $("div."+tablocator+" ul.quicktabs_tabs a#"+tab).click();
  $("div."+tablocator+" ul.quicktabs_tabs a").click(function() { $.cookie(pathname + tablocator, $(this).attr('id')); });

};
// -->
</script>
wizonesolutions’s picture

I got #82 going but also had to add drupal_add_js('sites/all/libraries/jquery.ui/external/cookie/jquery.cookie.js'); to THEMENAME_preprocess_page to get $.cookie to work.

ckng’s picture

D7 js only solution for #1454486: D7: Tab history.

Thanks for the inspiration from #62 & #64

Marceldeb’s picture

Hi all,
First of all: Thanks! Posts #67, #85, #86 helped me a lot.
When i use this implementation it works but a side effect appears.

The side effect is that the pager of my view inside the quicktab is broken because of this file: jquery.cookie.js

When i include this file (does not matter how, tried preprocess template as manual include in php) my browser shows a
'Do you want to save ajax.js file to your hard disk' dialog (Internet Explorer) when i click on the pagination.
When using firefox i see a white page with what appears to be the raw output of an ajax request .

Anybody had the same experience?

EDIT:
Seems that it was a coincidence that this problem appeared after i wanted to use cookies.
I tought the cookies were the problem but i think now it is because i also updated the quicktabs module to latest version.
My problem is this: http://drupal.org/node/1439302

jackbravo’s picture

Status: Active » Needs review
FileSize
5.21 KB

I have a patch that involves using the jQuery BBQ plugin (http://benalman.com/projects/jquery-bbq-plugin/) and adding two lines of code. It doesn't use cookies, it just changes the href for the pager links when you change the active tab so it works with and without cache. The BBQ plugin goes into the js folder of the module in this patch.


diff --git a/js/quicktabs.js b/js/quicktabs.js
index f6c3d2a..0cbc58f 100644
--- a/js/quicktabs.js
+++ b/js/quicktabs.js
@@ -155,6 +155,7 @@ var quicktabsClick = function() {
   // Show the active tabpage.
   if (tab.tabpage.hasClass('quicktabs_tabpage')) {
     tab.tabpage.removeClass('quicktabs-hide');
+    $('.pager a', tab.tabpage).querystring({ quicktabs_:tab.tabKey });
   }
   else {
     if ($(this).hasClass('qt_ajax_tab')) {
diff --git a/quicktabs.module b/quicktabs.module
index 5f24480..ad49f70 100755
--- a/quicktabs.module
+++ b/quicktabs.module
@@ -214,6 +214,7 @@ function quicktabs_render($quicktabs) {
     drupal_add_js(array('quicktabs' => array('qt_'. $quicktabs['machine_name'] => $settings)), 'setting');
   }
   drupal_add_js(drupal_get_path('module', 'quicktabs') .'/js/quicktabs.js');
+  drupal_add_js(drupal_get_path('module', 'quicktabs') .'/js/jquery.ba-bbq.min.js');
 
   $attributes = drupal_attributes(array(
     'id' => 'quicktabs-'. $quicktabs['machine_name'],
jackbravo’s picture

By the way. I liked this route better instead of using the cookie approach because then we could again follow more closely the 7.x branch that is using bbq plugin.

- http://drupal.org/node/1350832 (this issue was for the 7.x branch)

This issue for the 6.x branch is related to this, or could be a follow up: http://drupal.org/node/1056996

jason.fisher’s picture

Agree -- BBQ sounds delicious.

chinita7’s picture

I patched #89 to 6.x-3.1 but didn't work for me.

chinita7’s picture

I just realized that #67 doesn't work for views exposed filter in quick tabs well.

I have 3 views page with different URLs and each of them has exposed filter block. These 3 exposed filter blocks are in different 3 tabs of one quicktab.

When simply change the tab then go to another page and come back the last clicked tab is kept. However when using "Apply" of exposed filter, the last clicked tab is not kept with the result page. It seems that active tabs are moving around at random.

The active tab with the views result page should be the last clicked tab of the exposed filter that users applied.

Anybody has solved this?

jackbravo’s picture

@chinita7, have you tried the patch on #89?

It is a recent patch, so it should work with 3.1 i think.

chinita7’s picture

@ jackbravo Thanks for your response.

Yes I tried it again with 6.31 but doesn't work.
Once I patch it quicktab stop working with javascript and when a tab is clicked the page is refreshed with URL like
my-site.com?quicktabs_test=1#quicktabs-test
I also have tried it with a clean Drupal installation.

jackbravo’s picture

what do you men it stops working with javascript? Are you using ajax pagination?

chinita7’s picture

No I'm not using Ajax option. What I meant was when I click the tabs the page is reloaded. So it's just like menu tabs. Thanks.

tbenice’s picture

It'd be great to have this effect be select-able per qtab, instead of having a global affect. I think that fits with this feature request.

tbenice’s picture

@chinita7, did you download the bbq jquery plugin and copy the file over:

quicktabs/js/jquery.ba-bbq.min.js...

the lib might not be loading thus throwing javascript errors.

chinita7’s picture

@tbenice Yes I did and also tried uncompressed version from https://raw.github.com/cowboy/jquery-bbq/master/jquery.ba-bbq.js with those 2 lines added in quicktabs.module and quicktabs.js but still doesn't work. Actually it's not throwing error but it just reload the page when clicking the tabs. Sorry but I don' know how to check if the lib is load and not.

tbenice’s picture

@chinita7 often if there is a javasript error you will see this page loading behavior because the js isn't working. You can see if the js is loaded by inspecting the code using the developer tools in chrome, or firebug in firefox. I use chrome...in chrome, you can right click to 'inspect element' on the page, then click the resources tab and browse down to see if the script is in the list of scripts.

chinita7’s picture

@tbenice Thanks for your help. After checking I realized the lib was not loaded so I tried patch/install on a fresh Drupal installation again.
Now jquery.ba-bbq.min.js is loaded however the tab doesn't remember the last clicked one for me. It works just like the default behavior of quick tab module.
I'm using: Drupal 6.26 PHP 5.33 QuickTab 6.x-3.1, Garland them.
Quick tab setting: none Ajax mode 2 tabs (blocks or nodes)
Browser: IE 9, Firefox 12, Chrome 18
I also tried turn on/off cash mode at admin/settings/performance.

jackbravo’s picture

FileSize
5.29 KB

I just did a re-roll of the patch, because I added a fix to also remember last clicked tab when sorting a column.

@chinita7, I also realized that this is a patch not for 3.1 but for 3.x, so you need to use git to get latest dev version. It is working for me so far.

Note that this patch already includes de bbq minified plugin.

Elijah Lynn’s picture

Title: Remember last clicked tab » D6: Remember last clicked tab
Issue summary: View changes

Prefixing title with D6 as to improve clarity as to which issue is for D6 vs D7.

Doing the same for #1454486: D7: Tab history

adrianavaz’s picture

Hi, here I am, in 2016, trying to solve this issue. I'm using Drupal 7 and Quicktabs 7.x-3.6. Can anyone tell me which of the solutions above is the best? Thank you!

apaderno’s picture

Title: D6: Remember last clicked tab » Remember last clicked tab
Status: Needs review » Closed (outdated)

I am closing this issue, since it's for a Drupal version no longer supported.