[TIMOB-5813] TableView issue with className - Wrong row(s) updated!

GitHub Issue	n/a
Type	Bug
Priority	Critical
Status	Closed
Resolution	Cannot Reproduce
Resolution Date	2011-12-09T12:15:09.000+0000
Affected Version/s	Release 1.7.3
Fix Version/s	n/a
Components	Android
Labels	n/a
Reporter	Pete Berry
Assignee	Hieu Pham
Created	2011-09-22T07:42:40.000+0000
Updated	2017-03-23T18:40:21.000+0000

Description

Greetings, I have created a TableView, added a handful of rows then update one of those rows. The problem is that the wrong row or rows are being updated. If I turn the phone on the side and then back again, the rows show the correct information. I found that if I do not add "className" then it works fine. However I am under the impression that "className" is utilized internally to improve performance. We are also having problems with wrong check boxes on rows being updated. I wonder if this is related. The following code reproduces the issue. I have simplified everything, removing all of the complexities of my actual application.

Titanium.UI.setBackgroundColor('#000');

var win1 = Titanium.UI.createWindow({title:'Window 1'});
var TheListBox=Ti.UI.createTableView();
win1.add(TheListBox);

win1.addEventListener('open',OnLoad);
function OnLoad()
{
  function AddRow(_Caption)
  {
    _Caption = String(_Caption);

    // This works!
//    var RowObj=Ti.UI.createTableViewRow({title:_Caption});

    // This causes the wrong row or rows to be updated!                                          
    var RowObj=Ti.UI.createTableViewRow({className:'Anything here causes the problem!', title:_Caption});
                                          
    RowObj.Label=Ti.UI.createLabel({text:_Caption});
    RowObj.add(RowObj.Label);
    TheListBox.appendRow(RowObj);
  }

  for (i=1;i<=10;i++)
    AddRow(i);
}

  function OnTimeout()
  {
    TheListBox.data[0].rows[5].Label.text = 'OnTimeout';
  }
var TheTimer = setInterval(OnTimeout, 2000);

win1.open();

In the above example, the row labeled '6' should show 'OnTimeout', all the reset should show 1-9. The 6th row does show 'OnTimeout' correctly however, the 8th row also shows 'OnTimeout', which is incorrect. Turn the phone on the side and the rows will magically be displayed correctly! Change the code as follow and it works fine...

Titanium.UI.setBackgroundColor('#000');

var win1 = Titanium.UI.createWindow({title:'Window 1'});
var TheListBox=Ti.UI.createTableView();
win1.add(TheListBox);

win1.addEventListener('open',OnLoad);
function OnLoad()
{
  function AddRow(_Caption)
  {
    _Caption = String(_Caption);

    // This works!
    var RowObj=Ti.UI.createTableViewRow({title:_Caption});

    // This causes the wrong row or rows to be updated!                                          
//    var RowObj=Ti.UI.createTableViewRow({className:'Anything here causes the problem!', title:_Caption});
                                          
    RowObj.Label=Ti.UI.createLabel({text:_Caption});
    RowObj.add(RowObj.Label);
    TheListBox.appendRow(RowObj);
  }

  for (i=1;i<=10;i++)
    AddRow(i);
}

  function OnTimeout()
  {
    TheListBox.data[0].rows[5].Label.text = 'OnTimeout';
  }
var TheTimer = setInterval(OnTimeout, 2000);

win1.open();

The only difference is that "className" is not set!

Comments

Hieu Pham 2011-12-09

Unable to reproduce with latest master on both v8/rhino
Pete Berry 2012-03-23

Good morning, We tested with Mobile SDK 2.0.0.v20120319003254 and the problem appears to be fixed. Cheers, Pete
Lee Morris 2017-03-23

Closing ticket with reference to the previous comments.

JSON Source