Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Fire event when select tab

This should be simple.

(1) app.js simply opens 4 tabs/windows.

  • Code for one of the tabs:

var win2 = Titanium.UI.createWindow({
url:'main_windows/tab2.js',
titleid:'tab_2'
});

var tab2 = Titanium.UI.createTab({
title:'Tab 2',
icon:'image.png',
titleid:'tab_2',
window:win2
});

(2) In tab2.js I then perform an Aax request, which works fine. However, it only runs the Ajax request once, when I first open that tab.

I want it to run the Ajax function (or any function) every time I select that tab.

The below would do that kind of thing, but the code needs to be in app.js which then defeats the object of using another .js file. How do I do it so I can have all relevant code in the tab2.js file as you would expect it?

tabGroup.addEventListener('focus', function(e)
{
if(e.index=="3.0") {
//do anything
}
}

— asked March 13th 2011 by Chris Allen
  • mobile win32 android
0 Comments

11 Answers

  • Accepted Answer

    The fireEventsolution works for me on both iPhone and Android.
    In app.js:

    tabGroup.addEventListener('focus', function(e){
        if(e.index==1) {
            win2.fireEvent('youGotFocus', e);
        }
    });
    

    In tab2.js:

    var win = Titanium.UI.currentWindow;
    
    win.addEventListener('youGotFocus', function(e){
        Ti.API.info('Event handler in tab2.js called');
    });
    
    — answered March 15th 2011 by Peter Olsson
    permalink
    1 Comment
    • actually, you can call the focus event on the tab element. See my answer in this thread.

      — commented September 21st 2011 by Rene Pot
  • Just call the 'focus' event on the Tab.
    So:

    var tab = Ti.UI.createTab();
    tab.addEventListener('focus',function(){
        // do your thing here
    });
    
    — answered September 21st 2011 by Rene Pot
    permalink
    0 Comments
  • From the few tabs interfaces I've used from Titanium, once the window is created with them, it stays created.

    This might be a dirty hack, but at the beginning of your tab2 code you could check to see if a Ti.App.Properties flag is set. If not, set it to something like "1", run your code, then at the end unset it.

    Kind of a dirty hack but it should work.

    — answered March 14th 2011 by Josh Lewis
    permalink
    0 Comments
  • Thanks for the responses.

    Aaron Saunders, this is what I did first (mentioned in my first message). The problem is I want to put all the code in the tab2.js file (as it is an incluide file there would be no point having an include file otherwise). I want to do exactly what you said, but in the include file. I have tries to do this but can't get it to work.

    Josh Lewis, I see what you are saying, but I don't see how that would work. I still need to have some form of event for any code to run again, I think.

    A simple "if 'this' tab gets clicked again, then do xyz" would do it. (with 'this' being the tab2.js file and tab2/window2.

    Thanks again.

    Chris.

    — answered March 14th 2011 by Chris Allen
    permalink
    1 Comment
    • post the code in a pastie and I will take a look

      — commented March 14th 2011 by Aaron Saunders
  • The current window will get focus when the tab is displayed.
    You can use the following code in tab2.js:

    var win = Titanium.UI.currentWindow;
    
    win.addEventListener('focus', function (e) {
        Ti.API.info("Clicked on tab2");
    });
    
    — answered March 14th 2011 by Peter Olsson
    permalink
    2 Comments
    • Thanks, but this doesn't work.

      I've even created a new project and only put the basic code in, but it does nothing.

      I've only tested on Android.

      Anyone know how to do this?

      — commented March 15th 2011 by Chris Allen
    • Oups, the above code is what I currently use for iPhone.

      — commented March 15th 2011 by Peter Olsson
  • All I need is to know how to detect when a certain tab is selected/viewed etc. But it must be code I can put in the tab2.js include, not in app.js.

    — answered March 15th 2011 by Chris Allen
    permalink
    0 Comments
  • Thanks Peter, but I just can't get any of this to work.

    I can get fireEvent to work, but:
    (a) code must be still in app.js
    (b) it will only run once. Surely I still need the 'focus' event so it runs everytime the user re-opens the tab?

    Any ideas?

    Thanks.

    — answered March 15th 2011 by Chris Allen
    permalink
    0 Comments
  • Perfect. Thanks Peter.

    I must have had things mixed up.

    Thanks again.

    — answered March 15th 2011 by Chris Allen
    permalink
    0 Comments
  • Any ideas anyone?

    — answered March 14th 2011 by Chris Allen
    permalink
    0 Comments
  • Have you tried to call win2.fireEvent() from app.js?
    It would be a few lines of trivial code in app.js, but all the logic in tab2.js

    — answered March 15th 2011 by Peter Olsson
    permalink
    0 Comments
The ownership of individual contributions to this community generated content is retained by the authors of their contributions.
All trademarks remain the property of the respective owner.