Question

I have created a table which is filled in with remote data. I’m getting this data with a php script that creates xml. The xml looks a bit like this:

<kalender>
   <afhaaldag>
      <datum>Monday 30 January 2012</datum>
      <afval>GFT</afval>
      <afval>PMD</afval>
      <afval>Restafval</afval>
   </afhaaldag>
   <afhaaldag>
      <datum>Monday 06 February 2012</datum>
      <afval>GFT</afval>
      <afval>Snoeiresten</afval>
   </afhaaldag>
</kalender>

I have managed to get all the information in the correct position. Each ‘afhaaldag has one row in my table, and each tag inside that has a label. It looks something like this:

Monday 30 January 2012
GFT
Snoeiresten
Restafval

Monday 06 February 2012
GFT
Snoeiresten

I’m adding the multiple labels for ‘afval’ with this loop:

var allAfval = item.getElementsByTagName('afval');
var subView = Ti.UI.createView({bottom:10});
for(var j = 0; j<allAfval.length; j++)
{
    var afval = allAfval.item(j).text;
    var subLabel = Titanium.UI.createLabel({
        text:afval,
        color:'black',
        left:15,
        top:topPosition+20
    });
    topPosition +=20;
    subView.add(subLabel);
    subLabel.catId = afval;
    dataLabels.push(subLabel);
}
row.add(subView);
table.appendRow(row);

Now I want to enable user to filter labels, but since I have multiple labels in one row, I can’t use my previous solution (which worked fine until I added more ‘afval’ lables). To do the filtering I’m using a picker, with this eventListener:

picker.addEventListener('change', function(e)
{
    var filteredLabels = [];
    for(var k=0; k<dataLabels.length; k++)
    {
        if(e.row.id == 'alles')
        {
            filteredLabels = dataLabels;
        }
        else if(dataLabels[k].catId == e.row.id)
        {
            filteredLabels[filteredLabels.length] = dataLabels[k];
        }
        table.setData(filteredLabels);
    }
});

The problem is that my array dataLabels isn’t filled for some reason. When I do an alert at the end (right before I close my function) I’m getting this weird errorMessage (which doesn’t give me any information):

[Ljava.lang.Object;@43f0e008

Could someone please help me out, I’m really stuck with this.

Answer 1

after lots of frustration, but a whole lot more determination, I finally got the solution. What I did is this: I made a subView (because the labels have to come in one row, each row can have multiple labels) and stored the labels on that subView (the date I’m getting before this loop). I also created a new row (wich basically will replace the original rows from the table after the user has filtered) and I’m storing that information in a new array (which will replace the data source after filtering)

var allAfval = item.getElementsByTagName('afval');
var subView = Ti.UI.createView({bottom:10});
for(var j = 0; j<allAfval.length; j++)
{
    var afval = allAfval.item(j).text;
    var subRow = Ti.UI.createTableViewRow();
    var subLabel = Titanium.UI.createLabel({
        text:afval,
        color:'black',
        left:15,
        top:topPosition+20
    });
    var subLabelDate = Titanium.UI.createLabel({
        text:datum,
        color:'black',
        font:{fontWeight:'bold'},
        left:15,
        top:topPosition
    });
    topPosition +=20;
    subRow.add(subLabel);
    subRow.add(subLabelDate);
    subView.add(subLabel);
    subRow.catId = afval;
    dataLabels[y++] = subRow;
}
row.add(subView);

With this eventListener I filter through the table and give the users the information they want. Data is the original data source (so if the users want to see all the events they’ll get the original table, if they want a specific event they’ll get the new data source)

picker.addEventListener('change', function(e)
{       
    var filteredData = [];
    for(var k=0; k<dataLabels.length; k++)
    {
        if(e.row.id == 'alles')
        {
            filteredData = data;
        }
        else if(dataLabels[k].catId == e.row.id)
        {
            filteredData[filteredData.length] = dataLabels[k];
        }
        table.setData(filteredData);
    }
    table.setData(filteredData);
});

Hopefully it’s usefull to someone else. Let me know 🙂