June 27, 2011

Cancel tab selection in jQuery

Question by Mike

I have created some tool that has 4 pages.
I order to navigate between the pages I am using jQuery “tabs” (in the header of each page).

Is there a way to cancel the clicking operation after some tabs was clicked?
For example: If the page wasn’t saved the user will get a propper warning: “click YES in order to continue without saving or click NO in order to stay in the unsaved page”.

Thanks in advance.
Mike

Answer by Starx

In order to cancel or abort the tab’s ajax request do something like this

$('#tabs').tabs({
    ajaxOptions: {
        timeout: 10000,
        error: function() {
            // If error occurs while trying to load a page via AJAX, abort the tabs
            $('#tabs').tabs('abort');
        }
    }
});

For more information go here.

May 24, 2010

use jquery to refresh div tab onclick?

Question by Q7898339

I’m using tabs, but wondering if it’s possible to “refresh” tab content onclick?

Answer by Starx

Yes it is possible, but you dont need onClick event for this I think

use this

<div id="example">
     <ul>
         <li><a href="ajaxpage1.php"><span>Content 1</span></a></li>
         <li><a href="ajaxpage2.php"><span>Content 2</span></a></li>
         <li><a href="ajaxpage3.php"><span>Content 3</span></a></li>
     </ul>
</div>

Notice that: instead of giving the id of the tab’s division, a page link given
so every time you click on the tabs, it updates it

this degrades gracefully – the links, e.g. the content, will still be accessible with JavaScript disabled.

ps: I am assuming that you having a
working tabs

...

Please fill the form - I will response as fast as I can!