Titanium Community Questions & Answer Archive

Question

Unstable table view

I have a table view with three different row styles (each style has it's own unqiue className). I have a click event listener which does different tasks depending on the row style. So at the bottom of my table I have a 'more' row which when clicked appends another 15 rows above it. However randomly when I click on this the application will quit with no error. It's not consistent so I could have loaded in an additional 15 rows twice, or four times and it will quit when I click the row after that.

I've tried, removing and adding the event listener after appending rows. I've tried deleting and adding the more row after appending more rows. I've tried updating the more row after appending more rows. But this error is still there.

Is there something obvious that I'm missing to make this table view more stable. It doesn't help that no errors are logged, the error seems to occur on click rather than something which is processed because of the click event. It seems it's the actual event itself which is crashing.

Any help appreciated.

Answer 1

Hi. It's a bit hard to help without seeing (part of) your code.

You could also try using a specific data property for the row rather than 'looking up' the given className to respond to, by using row.yourProperty = 'whatever'; when you add each row to the table.

Answer 2

Yeah I have tried doing that as well. Ok here are some snippets of code:

  this.getListView = function(){
    this.rows[0] = this.createActivityRow();

    this.tableView = Titanium.UI.createTableView({
      data:this.rows
    });

    this.window.add(this.tableView);

    this.tableView.addEventListener('click', function(e) {
      Ti.API.info('click');
      if (e.index == 0) {
        thisObj.tableView.updateRow(0, thisObj.createActivityRow());
        thisObj.page = 1;
        thisObj.getListFromServer(null);
      }
      else if(e.rowData.customData == 'more'){
        thisObj.page++;
        thisObj.getListFromServer(thisObj.listData[thisObj.listData.length-1].nid);
      }
    });

    this.getListFromServer(null);
  }

  this.updateListView = function(){
    if (this.page == 1) {
      for (var i in this.listData){
        if (i == 0) {
          this.rows[i] = this.createReloadRow();
        }
        else {
          this.rows[i] = this.createDataRow(i);
        }
      }

      //Add more row
      if (this.listData.length == (this.page*15)+1) {
        this.rows.push(this.createMoreRow());
      }

      this.tableView.setData(this.rows);

      this.tableView.scrollToIndex(1, {animated:true, position:Ti.UI.iPhone.TableViewScrollPosition.TOP});
    }
    else {
      for (var i in this.listData){
        if (i > ((this.page-1)*15)) {
          this.rows[i] = this.createDataRow(i);
          this.tableView.insertRowAfter((i-1), this.rows[i]);
        }
      }
    }
  }

  this.getListFromServer = function(nid){
    var connection = Titanium.Network.createHTTPClient();

    connection.onload = this.receiveData;

    if (nid == null) {
      connection.open('GET', '...'+this.type);
    }
    else{
      connection.open('GET', '...'+this.type+'?nid='+nid);
    }

    connection.send();
  }

  this.receiveData = function(){
    var doc = this.responseXML.documentElement;
    var elements = doc.getElementsByTagName("node");

    if (thisObj.page == 1){
      //Push blank row for acvtivity row
      thisObj.listData = [];
      thisObj.rows = [];
      thisObj.listData.push({});
    }

    if (elements != null) {
      var i = 0;
      while (i < elements.length){
        var properties = elements.item(i);

        thisObj.listData.push({
          nid:       properties.getAttribute('nid'),
          type:      properties.getAttribute('type'),
          title:     properties.getAttribute('title'),
          teaser:    properties.getAttribute('teaser'),
          author:    properties.getAttribute('author'),
          created:   properties.getAttribute('created').toUpperCase(),
          event:     properties.getAttribute('event'),
          thumbnail: properties.getAttribute('thumbnail'),
          book:      properties.getAttribute('book'),
          audio:     properties.getAttribute('audio'),
          video:     properties.getAttribute('video')
        });

        i++;
      }
    }

    thisObj.updateListView();
  }

  this.createMoreRow = function(){
    var row = Ti.UI.createTableViewRow({
      height:80,
      backgroundImage: 'windows/row.jpg',
      className: 'more',
      customData: 'more'
    });

    var label = Titanium.UI.createLabel({
      color:'#306EC1',
      text: 'Load More Items...',
      font:{fontWeight:'bold',fontSize:16},
      textAlign:'left',
      top:22,
      left:10,
      height: 20
    });

    var description = Titanium.UI.createLabel({
      color:'#999',
      text: 'More content is ready to be viewed.',
      font:{fontWeight:'normal',fontSize:13},
      textAlign:'left',
      top:38,
      left:10,
      height: 20
    });

    row.add(label);
    row.add(description);

    return row;
  }

Let me know if you want more…

Answer 3

@Jordan:

Even though your code is incomplete (missing several functions), i implemented it to test, and i also get the same result - randomly, the application quits.

I have no idea if it's something with the insertRowAfter, or something else.

Have you got any new insight on this?

Titanium Community Questions & Answer Archive

We felt that 6+ years of knowledge should not die so this is the Titanium Community Questions & Answer Archive

Unstable table view

3 Answers