Data returns as "undefined" in Titanium

Question

I am working on a basic authentication mobile app for iPhone using:

Titanium v. 3.23

XAMPP as my local server and PHP

MySQL as local database

The app I am working on is based off the following tutorial:

http://code.tutsplus.com/tutorials/titanium-user-authentication-part-1--mobile-3728

I was able to get the code up and running from the tutorial with no problem, the app allowed me to post a username/password key to my local database, login with the key, and have the information displayed on my main window.

I began to manipulate the code to reflect more of what I am attempting to build, a single window based app (not tab based like in the tutorial) that would allow me to create a username/password key, login to a main window, and on that main window have my information displayed back to me.

I have successfully been able to modify the code to allow me to create a new username/password into my local database, as well as have the app verify if the username/password match upon login. However, when I login to my main screen, it shows that my username and password are "undefined". To check the error, I entered the same user/pass in the project currently holding the working code and it is visible. So I know my current PHP and database are all working correctly.

Currently, my app.js is:

setTimeout (function() {

var login;
login = require ('login');
login.LogIn();

var mainWin = Titanium.UI.createWindow();

Ti.App.addEventListener('grantEntrance', function(event){

mainWin.title = 'Welcome ' + event.name;
mainWin.url = 'main.js';
mainWin.name = event.name;
mainWin.email = event.email;

});

}, 2000);

The setTimeout function is to eventually be a splash screen which I added independent from the tutorial above. I also changed the "main" items to reflect my mainWin, rather than the "main" as indicated in the tutorial.

Currently, my login.js is:

function LogIn(){

var loginWin = Ti.UI.createWindow({
    backgroundColor:'white'
});

var username = Titanium.UI.createTextField({
color:'#336699',
top:10,
left:10,
width:300,
height:40,
hintText:'Username',
keyboardType:Titanium.UI.KEYBOARD_DEFAULT,
returnKeyType:Titanium.UI.RETURNKEY_DEFAULT,
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
});
loginWin.add(username);

var password = Titanium.UI.createTextField({
color:'#336699',
top:60,
left:10,
width:300,
height:40,
hintText:'Password',
passwordMask:true,
keyboardType:Titanium.UI.KEYBOARD_DEFAULT,
returnKeyType:Titanium.UI.RETURNKEY_DEFAULT,
borderStyle:Titanium.UI.INPUT_BORDERSTYLE_ROUNDED
});
loginWin.add(password);

var loginBtn = Titanium.UI.createButton({
title:'Login',
top:110,
width:90,
height:35,
borderRadius:1,
font:{fontFamily:'Arial',fontWeight:'bold',fontSize:14}
});
loginWin.add(loginBtn);

var createLabel = Titanium.UI.createLabel({
text:'Create Profile',
bottom: 25,
left:25
});
loginWin.add(createLabel);

var indicatorWin = Ti.UI.createView({
width: 320,
height: 480,
backgroundColor: '#000000',
opacity: 0.5
});

var acctInd = Ti.UI.createActivityIndicator({
height:50,
width:50,
style: Titanium.UI.createActivityIndicatorStyle.Plain,
top:250,
left:130
});

var actLabel = Titanium.UI.createLabel({
text: 'Checking Login Details',
color: '#FFFFFF',
left:70,
top:200,
height:50

});

indicatorWin.hide();
acctInd.hide();
actLabel.hide():

loginWin.add(indicatorWin);
indicatorWin.add(acctInd);
indicatorWin.add(actLabel);

var loginReq = Titanium.Network.createHTTPClient();

loginReq.onload = function()
{
var json = this.responseText;

var response = JSON.parse(json);

if (response.logged == true)

{
    username.blur();
    password.blur(); 

    Ti.App.fireEvent('grantEntrance', {
        name:response.name,
        email:response.email
    });
    loginWin.close();
        var main;
        main = require ('main');
        main.MainM();
}
else
{
    alert(response.message);
}
};

loginBtn.addEventListener('click',function(e)

{  
if (username.value != '' && password.value != '')

{

    loginReq.open("POST","http://localhost/Tuts/post_auth.php");

    var params = {
        username: username.value,
        password: Ti.Utils.md5HexDigest(password.value)
    };

    loginReq.send(params);

    indicatorWin.show();
    acctInd.show();
    actLabel.show();
}  
else
{
    alert("Username/Password are required");
}
});

createLabel.addEventListener('click', function(e) {
var ProfileWin, ProfileInc;
ProfileInc = require ('createProfile');
ProfileWin = new ProfileInc.CreateP();
ProfileWin.open();
});

loginWin.open();
return ;loginWin;
}
exports.LogIn=LogIn;

Currently, my main.js is:

function MainM(){

var mainWin = Ti.UI.createWindow({
backgroundColor:'white'
});

var msg = Titanium.UI.createLabel({
text:"\n\nYour email is:\n" + mainWin.email + "\n\nyour name is:\n" + mainWin.name,
top:10,
left:10,
width:300,
height:'auto'
});
mainWin.add(msg);

mainWin.open();
return ;mainWin;
}
exports.MainM=MainM;

As you can see I haven't changed much, if anything, to the actual database section of the app. Which is why I am confused that it isn't working. The only research I have found indicated that there might be a problem with an asynchronous request and heard that by using a setTimeout function i might be able to get around my error. I have attempted to insert the function in a few places however the error still persists.

Sorry so long, I have been working on this for a month and I wanted to be as detailed as possible.

Thanks for the help!

Answer 1

In your code, main screen is a new Window, which does not have access to the variables email and name.

What you can do to fetch the values in the min win is either Save them in Properties and use them, or modify your main.js .