Bug in tableviewrow with selecting, probably a Titanium SDK bug?

Hi Guys,

So i got my App in the iTunes Store finally but there has been an annoying bug which i can't seem to fix. Its about this app: http://itunes.apple.com/nl/app/psx-sense/id488587133?l=nl&ls=1&mt=8

And the bug is that when u are in the first screen when you start the app, you see a couple of tableviews. When you select one of them but dont actually click it and scroll further, and click another one to actually view. The tableview you first selected opens.

Is there a way to fix this or is this really a SDK-problem?

Code for click is as follows:

tableview.addEventListener('click',function(e) {
    var w = Ti.UI.createWindow({title:'Artikel Bekijken', barColor:'#336699'});
    var wb = Ti.UI.createWebView({url:e.row.url});
    w.add(wb);

King regards,

Roy

I have resolved the issue by setting the touchEnabled attribute to false (touchEnabled:false) for all elements (views, labels, etc) that are added to the tableViewRow.

The issue appears to be caused by the subviews receiving the touch events rather than the tableViewRow and, therefore, not clearing the selected index.

Roy,

I can confirm this behavior in 1.7.5 in one of our production apps as well. Have to say, in testing, I've never "selected" a row then clicked on another. Post it to the JIRA and let me know the id so I can follow it for attention.

Has anyone been able to resolve this problem. I am having the same issue with 1.8.2 and noticed that the KitchenSink app behaves the same way. I would love to get this fixed.

Ok, I posted a video on youtube using an iPhone4 that really explains it all :)

The code used:

var win = Titanium.UI.createWindow({ 
    backgroundColor:'#000'
});
 
// ROW 0
var TableViewRow0 = Ti.UI.createTableViewRow({
    height:'75dp', backgroundColor:'white', selectedBackgroundColor:'blue',num:0
});
 
var LabelVar0 = Ti.UI.createLabel({
    top:'1dp',left: '6dp',textAlign:"left",text:'number 0',color:'black',font:{fontSize:'25dp'}, height:'25dp'
});
TableViewRow0.add(LabelVar0);
 
// ROW 1
var TableViewRow1 = Ti.UI.createTableViewRow({
    height:'75dp', backgroundColor:'white', selectedBackgroundColor:'blue',num:1
});
 
var LabelVar1 = Ti.UI.createLabel({
    top:'1dp',left: '6dp',textAlign:"left",text:'number 1',color:'black',font:{fontSize:'25dp'}, height:'25dp'
});
TableViewRow1.add(LabelVar1);
 
// ROW 2
var TableViewRow2 = Ti.UI.createTableViewRow({
    height:'75dp', backgroundColor:'white', selectedBackgroundColor:'blue',num:2
});
 
var LabelVar2 = Ti.UI.createLabel({
    top:'1dp',left: '6dp',textAlign:"left",text:'number 2',color:'black',font:{fontSize:'25dp'}, height:'25dp'
});
TableViewRow2.add(LabelVar2);
 
// Table
var table = Ti.UI.createTableView({
    data:[TableViewRow0, TableViewRow1,TableViewRow2],
    borderWidth:'0',
    separatorColor:'black'
});
win.add(table);
 
table.addEventListener('click', function(e) {
    Ti.API.info(e.rowData.num); 
 
});
/*
// A listener on the tableview (not in the table) has the same results
// comment the table click listener if you want to test this one
TableViewRow2.addEventListener('click', function (e) {
    Ti.API.info("**************** " + e.index);
});  */
 
win.open();

(I oversimplified this code duplicating a lot, but it's ok to see where is the problem)

Hope that this video and this code can help to resolve this problem on next versions.

Thanks!,

Lluis Gerard

OK! I've found a workaround!!!! :)

Using data var to save each row and re-setting it again when the touchcancel triggers, does the trick:

table.addEventListener('touchcancel', function(e) {
    Ti.API.info('refreshing table data');       
    table.setData(tableData);   
});

The whole code to see it working is here:

var win = Titanium.UI.createWindow({ 
    backgroundColor:'#000'
});
 
// Table
var table = Ti.UI.createTableView({
    borderWidth:'0',
    separatorColor:'black'
});
var tableData = [];
 
// Rows
for (i = 0; i < 10; i++) {
 
    var row = Ti.UI.createTableViewRow({
        height:'75dp', backgroundColor:'white', selectedBackgroundColor:'blue',num:i
    }); 
    var label = Ti.UI.createLabel({
        top:'1dp',left: '6dp',textAlign:"left",text:'label ' + i,color:'black',font:{fontSize:'25dp'}, height:'25dp'
    });
    row.add(label);
    tableData.push(row);
 
}
table.setData(tableData);
 
// Listener that starts the bug
table.addEventListener('click', function(e) {
    Ti.API.info(e.rowData.num);     
});
 
// Workaround to avoid select and cancel bug
table.addEventListener('touchcancel', function(e) {
    Ti.API.info('refreshing table data');       
    table.setData(tableData);   
});
 
win.add(table);
win.open();

This don't solve the real problem, but it works until appcelerator fix the bug :)

I'm very happy cause I'm doing a demonstration shortly and the way my app works had a lot of troubles with this bug. Hope it can help others in the meantime.