Basic Alloy : Dynamic TableView Handling

index.js

function showItems(e) {  
    Ti.API.info(e.rowData.itemName);
}

var rowData=[];
for(var i=1;i<=10;i++){
	var payload={
		rowId:i,
		itemName:'Test' + i
	}
	var row=Alloy.createController('row',payload).getView();
	rowData.push(row);
}
$.itemsList.data=rowData;


$.win.open();

index.tss

"#container": {
	backgroundColor:"white"
}

index.xml

<Alloy>
	<Window id="win">
		<TableView id="itemsList" onClick="showItems">
		</TableView>
	</Window>
</Alloy>

row.js

var args = arguments[0] || {};

$.row.rowId=args.rowId;
$.row.itemName=args.itemName;
$.itemName.text=args.itemName;

row.tss

"#row":{
	height: "40dp",
	hasChild: true
},
"#itemName": {
	width: Ti.UI.SIZE,
	height: Ti.UI.SIZE,
	color: "#000",
	left: 0
}

row.xml

<Alloy>
	<TableViewRow id="row" rowId="1" itemName="Test1">
		<Label id="itemName">Test 1</Label>
	</TableViewRow>
</Alloy>