Appcelerator: Multiple Subviews Syncing to Last Callback - titanium

Question

I'm creating a custom menu with background images, styling, etc. so I created a separate menuTile view and controller and send it the background, title, and callback. If I add multiple menuTiles using the Require tag, all tiles fire the callback of the last menuTile instead of their own individual one. I'm confident there is no bug/typo in my code so maybe it's a misunderstanding of the Require tag or callbacks. Please assist.
Menu.xml, Menu.js...
<View id="vwBody">
<Require src="menuTile" id="menuTile1" />
<Require src="menuTile" id="menuTile2" />
<Require src="menuTile" id="menuTile3" />
</View>
function initializeMenuTiles() {
$.menuTile1.initialize({
backgroundImage: 'img1.jpg',
title: 'Menu Tile 1',
callback: btnMenuTile1Click,
});
$.menuTile2.initialize({
backgroundImage: 'img2.jpg',
title: 'Menu Tile 2',
callback: btnMenuTile2Click,
});
$.menuTile3.initialize({
backgroundImage: 'img3.jpg',
title: 'Menu Tile 3',
callback: btnMenuTile3Click,
});
}
MenuTile.js...
$.initialize = function(args) {
$.btnMenuTile.backgroundImage = '/images/' + args.backgroundImage;
$.btnMenuTileLabel.text = args.title;
if (args.callback) {
btnMenuTileClicked_callback = args.callback;
}
};
function btnMenuTileClick() {
if (btnMenuTileClicked_callback) {
btnMenuTileClicked_callback();
}
}
So no matter what menuTile I click, btnMenuTile3Click will always fire. If I don't provide a callback for menuTile3, then btnMenuTile2Click will always fire.

Answer 1

I don't see where you define btnMenuTileClicked_callback so it will then be in the module's global scope, which is shared between all instances.
Simply add this before the $.initialize... line:
var btnMenuTileClicked_callback;