[TIMOB-2706] How to remove label from tableviewrow?

Hi,

I would like to have a tableview which is populated with tableviewrows. I add a 'click' event listener to each row. Upon click, I add a label to the row and refresh the table. By doing this I'm hoping to create a drawer effect where more details are displayed within the selected row.

I want to take this one step further by implementing a second click, such that when the user clicks on the expanded row, the label is removed and the row shrinks back to its original size. However, I'm having problems with removing the label. Could someone advise on how to go about doing this? Here is a sample of my code:

// Add row details // // ............... //

row.addEventListener('click',rowExpand);

// Click event function //

function rowExpand(e) {

Ti.API.info(e.source.nameID);
e.source.removeEventListener('click',rowExpand);    // Remove click event listener
var pos = e.source.nameID;

// Add label
var mName =  Titanium.UI.createLabel({
    text:globaljson[pos].mname,
    font:{fontSize:12,fontWeight:'normal'},
    width:'auto',
    textAlign:'left',
    top: 50,
    left:70,
    height:'auto',
    touchEnabled:false
});

data[pos].add(mName);
data[pos].height = 'auto';
data[pos].addEventListener('click',function(e){
    e.source.removeEventListener('click',e.source);
    data[pos].remove(mName);    // Doesn't work. Why?
    data[pos].height = 'auto';
    data[pos].addEventListener('click',rowExpand);
    tableview.setData(data);
});
tableview.setData(data);

};