Search code examples
titaniumtitanium-mobileappcelerator-titanium

Titanium appcelerator tableview keep height when setData with empty array


I have a tableview that i feed with data like this :

var liste = ['Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi','Dimanche'];
var days = [];

for (var i = 0; i < liste.length; i++) {
    days.push(Alloy.createController("common/_item_tableview", {
                text_filtre : liste[i],
                checked : true,
            }).getView());
}

$.my_tableview.setData(days); // or $.my_tableview.data = days;

With this code i get a tableview filled with days rows, now i want to click on a button and get rid of all tableview rows :

$.my_button.addEventListener('click', function(){
    $.my_tableview.setData([]);
})

All rows are deleted but the tableview still keep his height, do you have any idea please ? here is a screenshot after setData([]), and when i want to re-feed the tableview with another data, a bit space is added above this.

Screenshot Tableview after setData([])

Thank you.


Solution

  • It may be a good idea for you to add the style properties that the TableView has right now. Are you using Ti.UI.SIZE as the height property of the TableView? If not, then you should do it. If you do, then it may be a good idea to re-set it after the setData method is called.

    $.my_button.addEventListener('click', function(){
        $.my_tableview.setData([]);
        $.my_tableview.height = Ti.UI.SIZE;
    });
    

    Now, another thing will be to have the TableView's height as Ti.UI.FILL to occupy the entire screen. When you need to clear the data you should just make the TableView not visible like this:

    $.my_button.addEventListener('click', function(){
        $.my_tableview.visible = false;
    });
    

    Then if you need to populate it again you can just make it visible after you set the new data.

    var newData = []; // This represents the new TableViewRow array 
    $.my_tableview.setData(newData);
    $.my_tableview.visible = true;