DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Roger has posted 34 posts at DZone. View Full User Profile

Timer Function For JQuery

07.31.2008
| 20792 views |
  • submit to reddit
        // This is a quick sample of how the plugin jquery.timers.js works. The timer code can
// be downloaded from http://jquery.offput.ca/every/
// or from http://www.downloadjavascripts.com/list/javasitekk37/Details.aspx
//
// I use the timer to avoid race-condition issues when switching from tab to tab in 
// a JQuery UI. Since JavaScript doesn't (as far as I can tell) have a system for 
// managing threads, I needed to introduce a slight delay to stop the code 
// from trying to set focus on a tab before the tab was actually made visible.
// This code works on both IE and Firefox -- and, of course, slightly better 
// on Firefox.
//
// Interesting side note: I used to switch on the field returned by 
// "$tabs.data('selected.tabs');" but in IE the value would often switch
// back to zero before selecting that tab. Another race condition. So I found
// it safer to simply dictate to the switch statement which tab I wanted to select.
//
// Also, there seems to be an issue with the timer plugin -- I could not get it to 
// work without having to specify seconds, miliseconds, etc. It is supposed to default
// to using miliseconds, but it did not seem to recognize integers at all, and needed time
// passed in strings with "ms" attached. It's entirely possible that I overlooked something,
// but I had a deadline looming so I just went with what I could get to work.
//

function selectNextTab(tabName) {
    
    switch(tabName) {
        case ("firstTab"):
            $('#application > ul').tabs('select', 1).oneTime("50ms", function() { 
                $('select#notificationType').focus();
            });
            break;
        
        case ("secondTab"):
            $('#application > ul').tabs('select', 2).oneTime("50ms", function() { 
                $('input#annualIncome').focus(); 
            });
            break;
        
        case ("thirdTab"): 
            $('#application > ul').tabs('select', 3).oneTime("50ms", function() {
                $('select#typeOfAssist').focus();
            });
            break;
    }
}