Titanium alloy: access to the user interface from different controllers?

Question

I seem to have problems updating objects in Titanium Apcelerator Alloy,

Basically I want to add a table row to a table that is in another controller / view in which I am now. I hope it will be better to describe this below: s

basket.xml

<Alloy> <Window id="basketWindow" class="container"> <TableView id="basketTable" /> <Button id="addItemButton" onClick="addItem">Add Item</Button> </Window> </Alloy> 

basket.js

 function addItem() { var itemList = Alloy.createController('item_list'); itemList.getView().open(); } 

item_list.xml

 <Alloy> <Window id="itemListWindow" class="container"> <TableView id="itemListTable"> <TableViewRow id="item1" className="item" onClick="addItemToBasket"> Test Item </TableViewRow> </TableView> </Window> </Alloy> 

item_list.js

 function addItemToBasket() { var row = Ti.UI.createTableViewRow({title: 'Test Item'}); // Here i would ideally want to put something like $.basketTable.append(row); // But nothing happens, im guessing it cant find $.basketTable as its in a different controller? } 

Does anyone know about this?

Thank you for reading:)

Answer 1

One simple and simple solution is to simply trigger the application event when you add an item to the cart:

 function addItemToBasket() { Ti.App.fireEvent("app:itemAddedToBasket", { title : "Test Item", otherAttribute : "Value" }); } 

Then listen to the event in the basket controller somewhere and add a table row:

 // inside basket.js Ti.App.addEventListener("app:itemAddedToBasket", function(e) { // object 'e' has all the row information we need to create the row var row = Ti.UI.createTableViewRow({ title: e.title, otherAttribute: e.otherAttribute }); // Now append it to the table $.basketTable.append(row); });