Michael Frans
Michael Frans

Reputation: 623

How to close modal window from other JS file on titanium mobile?

i create this simple login App in titanium mobile.. here's my code :

Login.js

function Login() {
    var loginView = Titanium.UI.createView({
        backgroundColor:'#C4FBFF',
        layout:'vertical'
    });

    var txtUsername = Titanium.UI.createTextField({
        width:'75%',
        hintText:'Username',
        borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
    });

    var txtPassword = Titanium.UI.createTextField({
        width:'75%',
        hintText:'Password',
        borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED,
        passwordMask:true
    });

    var btnLogin = Titanium.UI.createButton({
        title:'Login',
        width:'75%'
    });

    loginView.add(txtUsername);
    loginView.add(txtPassword);
    loginView.add(btnLogin);

    btnLogin.addEventListener('click',function(e){
        var alertDialog = Titanium.UI.createAlertDialog({ 
            title: 'Confirmation', 
            message: 'You will be logged in as ' + txtUsername.value + ', continue?',
            buttonNames: ['Yes','No'] 
        });

        alertDialog.addEventListener('click',function(e){
            if (e.index === 0){ //Yes Pressed
                var MainMenu = require('ui/common/MainMenu');

                var mainMenuWindow = Titanium.UI.createWindow({
                    backgroundColor:'#336699',
                    title:'Main Menu',
                    modal:true
                });

                var mainMenu = new MainMenu();
                mainMenuWindow.add(mainMenu);

                mainMenuWindow.open();
            }
            else{ // No Pressed
                makeAlert('Login','Please contact your system administrator');
            }
        });

        alertDialog.show();
    });

    function makeAlert(title, message) {
        var customAlertDialog = Titanium.UI.createAlertDialog({ 
            title: title, 
            message: message,
            buttonNames: ['Ok']
        });
        return customAlertDialog.show();
    }

    return loginView;
}

module.exports = Login;

and this is my MainMenu.js :

function MainMenu(){
    var mainMenuView = Titanium.UI.createView({
        backgroundColor:'#C4FBFF',
        layout:'vertical'
    });

    var btnClose = Titanium.UI.createButton({
        title:'Close',
        height:30,
        width:150
    });

    mainMenuView.add(btnClose);

    btnClose.addEventListener('click',function(e){
    //What should i do here?
    }); 
    return mainMenuView;
}    
module.exports = MainMenu;

The main problem is i want to close modal window when close button is pressed. i've tried Titanium.UI.currentWindow.close() but it close all my application and it can't be executed on iOS devices. any suggestion?? many thanks..

Upvotes: 0

Views: 1570

Answers (1)

Aaron Saunders
Aaron Saunders

Reputation: 33345

// pass parent window in as parameter
var mainMenu = new MainMenu(mainMenuWindow);
mainMenuWindow.add(mainMenu);

now use the parameter

function MainMenu(_parent /*parent window*/){

    // other code ...

    btnClose.addEventListener('click',function(e){
        _parent.close();
    });

}

Upvotes: 3

Related Questions