Titanium Community Questions & Answer Archive

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

Modal Window Driving me Insane! disapearing table

Hi All,

so i have been at this for a few hours now and its slowly driving me insane, i cannot for the life in me figure it out.

here is a very simple working (or not as its broken somehow) example

I have 2 files

app.js

Ti.include('windows/window1.js');

var tabGroup = Titanium.UI.createTabGroup();
var main = Ti.UI.createWindow({title:'My Window',url:'main.js'});
var tab1 = Titanium.UI.createTab({
    title:'main window',
    window:main
});

tabGroup.addTab(tab1);

tabGroup.setActiveTab(1); 
// open tab group with a transition animation
tabGroup.open({
    transition:Titanium.UI.iPhone.AnimationStyle.FLIP_FROM_LEFT
});

var modal = Ti.UI.createButton({
    systemButton:Ti.UI.iPhone.SystemButton.INFO_LIGHT
});

main.setRightNavButton(modal)

main.open()

winopen();

modal.addEventListener('click',function(e)
{
    winopen();
});

windows/window1.js

var win = Ti.UI.createWindow({title:'My Window',barColor:'#13386c'});

var done = Ti.UI.createButton({
    systemButton:Ti.UI.iPhone.SystemButton.DONE
});
win.setRightNavButton(done);
var data = [
    {title:'Set 1'},
    {title:'Set 2'}
];
var table = Ti.UI.createTableView({
    style: Ti.UI.iPhone.TableViewStyle.GROUPED,
    data:data,
    rowHeight:50
});

win.add(table);

var winopen =  function()
{
    win.open({modal:true});
};

done.addEventListener('click', function()
{
    win.close();
});

Now as you would expect on initially loading, my app slides up the modal window1.js. all correct and working lovely

now you hit done and it take you back to the main window, which has a info button in the rightNavBar location

if you hit that button it fires a event which again opens the modal box

but this time there is no table to be seen!.

i just cannot understand why this works as expected

winopen();

but this doesnt

button.addEventListener('click',function(e)
{
    winopen();
});

can anyone put me out of my misery?

Thanks in advance

Richie

— asked July 24th 2010 by Richie Mortimer
  • event
  • ipad
  • modal
  • tableview
0 Comments

4 Answers

  • Try to add the table to the modal win when it opens.
    So on the open event.

    win.addEventListener('open', function(e) {
       win.add(table);
    });
    

    I think when you call close, the content of the window is released, so on a subsequent open, there is nothing to show.

    — answered July 24th 2010 by Dan Tamas
    permalink
    0 Comments
  • function winopen(winName)
    {
        winName.open({modal:true});
    };
    
    button.addEventListener('click',function(e)
    {
        winopen(win);
    });
    

    Try that

    — answered July 24th 2010 by Sj Singh
    permalink
    0 Comments
  • It seems that the TableView is deleted each time the modal closes, so you need to define and add a new tableview each time you want to open the modal. If you define it once (as Tamas indicated) it doesn't work.

    This code has been tested in Titanum SDK 1.5.1 / iOS 4.2 and works correctly:

    var mainWin = Titanium.UI.createWindow();
    var modalWin = Titanium.UI.createWindow();
    var closeButton = Titanium.UI.createButton({title:"done",height:30,width:80});
    modalWin.rightNavButton = closeButton;
    closeButton.addEventListener("click",function(){modalWin.close();});    
    
    var openButton = Titanium.UI.createButton({title:"open",height:30,width:80});
    openButton.addEventListener("click",function(){
        var table = Ti.UI.createTableView({
            data:[{title:"Enter your own quote"},{title:"Quote Font Size"}]
        });
        modalWin.add(table);    
        modalWin.open({modal:true});
    
    });
    
    mainWin.add(openButton);
    mainWin.open();
    
    — answered January 26th 2011 by brian kurzius
    permalink
    3 Comments
    • So it seems this would be a bug then, right?

      — commented January 30th 2011 by Marshall Jones
    • …or a feature :-)

      — commented January 30th 2011 by brian kurzius
    • I have also notified Appcelerator (through the Helpdesk) and am waiting for confirmation that this has been logged as a bug.

      — commented January 30th 2011 by brian kurzius
  • Hi Guys,

    Thanks both for replying. I can tell you though that neither option results in a working window with table.

    Daniel is correct in saying that the contents of the window appear to be released. if i remove the initial call to winopen and run the on event against the button the window is drawn correctly.

    closing and then reopening results again in the missing table.

    i will keep plugging away at it and see if i can come up with anything further

    thanks again

    — answered July 25th 2010 by Richie Mortimer
    permalink
    1 Comment
    • Okay i finally got it to work by wrapping the whole window creation in a function and calling that function from the eventListener

      window1 = {};
      window1.init = function() {
       // create your window here and open it
      };
      
      
      then in app.js
      
      button.addEventListener('click',function(e)
      {
          window1.init();
      });
      

      not the best solution (certainly need to check the performance of it) but it works

      — commented July 26th 2010 by Richie Mortimer
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.