OptionsDialog only seems to associate with last TableRow
I have what I thought was a pretty simple requirement - file browsing the Data directory to either Upload or Delete the files.
However, the OptionDialog created will only associate itself with the last row in the table.
var dir = Titanium.Filesystem.getFile(Titanium.Filesystem.applicationDataDirectory);
var listing = dir.getDirectoryListing();
Ti.API.info('directoryListing = ' + listing);
Ti.API.info('getParent = ' + dir.getParent());
Ti.API.info('spaceAvailable = ' + dir.spaceAvailable());
var data = [];
var z = 0;
for (var i = 0; i < listing.length; i++) {
Ti.API.info('Found file: ' + listing[i]);
var row = Ti.UI.createTableViewRow({height:50,width:200, selectedBackgroundColor:'#777'});
var rlabel = Ti.UI.createLabel({
text:listing[i], left:5, top:5}
);
var dialog = Titanium.UI.createOptionDialog({
options:['Upload', 'Delete', 'Cancel'],
destructive:1,
cancel:2,
title:listing[i]
});
dialog.addEventListener('click',function(e)
{
Ti.API.info('Action: ' + e.index + ' and filename is ' + e.source.title);
});
rlabel.addEventListener('click',function()
{
dialog.show({view:rlabel,animated:true});
});
row.add(rlabel);
data[z++] = row;
}
var table = Titanium.UI.createTableView({
data:data,
height: 500,
top:150
});
Upload.view.add(table);
Anyone know how to create the OptionDialogs in such as way as they are tied to the correct row?
1 Answer
-
Accepted Answer
Yeah - this is a pretty basic JS issue, not specific to Titanium… There's a lot of ways to accomplish this. Probably the easiest is something like this…
change your row to add the label as a data property - will be ignored by table but used below…
var row = Ti.UI.createTableViewRow({ height:50, width:200, selectedBackgroundColor:'#777', text:listing[i] });change your click handler to just fire to a generic function (defined below)
row.addEventListener('click',rowClick);outside your loop define your row handler:
function rowClick(e) { // source points to the person firing the event // which is the row, get the title from the row var title = e.source.text; // now do your normal option dialog code var dialog = Titanium.UI.createOptionDialog({ options:['Upload', 'Delete', 'Cancel'], destructive:1, cancel:2, title:title }); // finish your dialog code as normal here }Since all events have a
sourceproperty which is the object that fired the event - in this case the row object - you can now simply pull out a property from the object - in this casetext.Now just build the option dialog on the fly with that data.