I am trying to figure out how to pass an argument between views in alloy. I will have a have nav group which will have multiple tables, so it maybe 3 to 5 levels deep.
I can pass arguments from the controller to the view but I want to pass information (ids of categories) from the view to the next table when it is clicked.
I am not sure how to do this in alloy, I always get undefined errors when trying to access the variable. Below is my current setup.
In my views I have: index.xml, master.xml, row.xml, detail.xml, subDetail.xml
Index.xml
<Alloy>
<Window id="index">
<NavigationGroup id="navgroup">
<Require src="master" id="master"/>
</NavigationGroup>
</Window>
</Alloy>
Here is my index.js
Alloy.Globals.navgroup = $.navgroup;
$.master.on('detail', function(e) {
// get the detail controller and window references
var controller = Alloy.createController('detail');
var win = controller.getView();
// open the detail windows
$.navgroup.open(win);
/*
if (OS_IOS && Alloy.isHandheld) {
Alloy.Globals.navgroup.open(win);
} else if (OS_ANDROID) {
win.open();
}*/
});
$.index.open();
master.xml
<Alloy>
<Window title="Categories">
<TableView id="table" onClick="openDetail">
</TableView>
</Window>
</Alloy>
master.js
function openDetail(e) {
$.trigger('detail', e);
}
var data = [];
var sendit = Ti.Network.createHTTPClient({
onerror: function(e){
Ti.API.debug(e.error);
alert('There was an error during the connection');
},
timeout:1000,
});
//Here you have to change it for your local ip
sendit.open('GET', 'http://url.com/json.php?showCats=1');
sendit.send();
//Function to be called upon a successful response
sendit.onload = function(){
var json = JSON.parse(this.responseText);
//var json = json.todo;
//if the database is empty show an alert
if(json.length == 0){
$.table.headerTitle = "The database row is empty";
}
//Emptying the data to refresh the view
//Insert the JSON data to the table view
for ( var i=0; i<json.length; i++){
data.push(Alloy.createController('row', {
name: json[i].CatName,
catID: json[i].CatID
}).getView());
//data.push(row);
Ti.API.info(json[i].CatName);
Ti.API.info(json[i].CatID);
}
$.table.setData(data);
};
row.xml
<Alloy>
<TableViewRow>
<Label id="name"/>
<Label id="catID"/>
</TableViewRow>
</Alloy>
row.js
var args = arguments[0] || {};
$.row.fighterName = $.name.text = args.name;
$.catID.text = args.catID;
detail.xml
<Alloy>
<Window title="Sub Categories">
<TableView id="subtable" onClick="openSubDetail">
</TableView>
</Window>
</Alloy>
detail.js
function openSubDetail(e) {
$.trigger('subDetail', e);
}
var data = [];
var sendit = Ti.Network.createHTTPClient({
onerror: function(e){
Ti.API.debug(e.error);
alert('There was an error during the connection');
},
timeout:1000,
});
//Here you have to change it for your local ip
Ti.API.info('Cat id');
Ti.API.info(catID);
Ti.API.info('data Value:'+ $.detail.catID );
sendit.open('GET', 'http://url.com/mobile/includes/json.php?catID=12');
sendit.send();
//Function to be called upon a successful response
sendit.onload = function(){
var json = JSON.parse(this.responseText);
//var json = json.todo;
//if the database is empty show an alert
if(json.length == 0){
$.table.headerTitle = "The database row is empty";
}
//Emptying the data to refresh the view
//Insert the JSON data to the table view
for ( var i=0; i<json.length; i++){
data.push(Alloy.createController('subDetail', {
name: json[i].SubcatName,
catID: json[i].CatID
}).getView());
//data.push(row);
Ti.API.info('Second Level');
Ti.API.info(json[i].SubcatName);
}
$.subtable.setData(data);
};
