Titanium Mobile: cant navigate between pages

Question

i am new to Titanium and i am have 2 seemingly simple problems while trying to use it for the Android.

1) i am trying to navigate to the next page on click of a butt

Answer 1

For your first problem, you are using the url property with a CommonJS object. So instead instantiate your window like this:

var newWindow = require("/ui/common/CreateNewMeetupWindow");
newWindow.open();

You would use the url property if your CreateNewMeetupWindow.js was not a CommonJS module.

Not sure what your second problem is, check your device logs and crash reports, otherwise there is no way to know what is going on.

Answer 2

You can use the following methods in your program to navigate between windows

Method 1

//Your app.js file
var button = Ti.UI.createButton({
    height:44,
    width:'auto',
    title:'Create New Meetup',
    top:20
});
self.add(button);

button.addEventListener('click', function() {
    //By doing this you're opening a new window
    var newWindow = Ti.UI.createWindow({
        url : "ui/common/CreateNewMeetupWindow.js",//Provide the correct path here
        fullscreen: false
    });
    newWindow.open();
});


//Your CreateNewMeetupWindow.js file

var newWindow = Ti.UI.currentWindow;

var contactsField = Ti.UI.createTextField({
    borderStyle : Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
    color : '#336699',
    width : 400,
    height : 60
});
newWindow.add(contactsField);

//You can add other controls here just like I added the contactsField

Method 2

var button = Ti.UI.createButton({
    height:44,
    width:'auto',
    title:'Create New Meetup',
    top:20
});
self.add(button);

button.addEventListener('click', function() {
    var window = require('/ui/common/CreateNewMeetupWindow');
var newWindow = new window();
    newWindow.open();
});

//Your CreateNewMeetupWindow.js file

function CreateNewMeetupWindow() {
    var self = Ti.UI.createWindow({
        layout : 'vertical',
        backgroundColor:'white'
    });

    var contactsField = Ti.UI.createTextField({
        borderStyle : Ti.UI.INPUT_BORDERSTYLE_ROUNDED,
        color : '#336699',
        width : 400,
        height : 60
    });
    self.add(contactsField);

    //Add other controls here

    return self;
}
module.exports = CreateNewMeetupWindow;

You can use any single method from above. Do not mix the methods together.

You can use the following link for references

1. http://docs.appcelerator.com/titanium/latest/#!/api/Titanium.UI.Window-property-url
2. http://docs.appcelerator.com/titanium/latest/#!/api/Global-method-require