display custom tableview rows

Question

I am attempting to pull data from the local database and display it in a tableview that uses a custom row. I do not know how to get it to display properly. the way it is currently written will display one row with the data correctly displayed in it, but it appears to be showing thousands of empty rows. I think my problem is because I have two while (rows.isValidRow()) statements. Would someone please show me the code to make this display correctly? Here is my current code:

//Setup the window
var win = Titanium.UI.currentWindow;
win.barColor='#000000';

//install database
var db = Ti.Database.install('bcapool3.sqlite','distributor');

//Get data
var rows = db.execute('SELECT * FROM distributor');

// create table view
var tableview = Ti.UI.createTableView({
    backgroundColor:'transparent',
    color: '#000000',
    top:80,
    height:'auto',
    left:80,
    right:80,
    bottom:120
});


function setData() {

while (rows.isValidRow())
{
var dataArray = [];
var row = Ti.UI.createTableViewRow({
    haschild: true,
    path: 'distributordetail.js'
});
    var title = Ti.UI.createLabel({ 
    color:'#000000',
    height:32,
    left:5,
    top:2,
    font:{fontSize:'18dp',fontWeight:'bold' },
    backgroundColor:'transparent',
    text:'' + rows.fieldByName('distributor_name') + ''
    });

    var address = Ti.UI.createLabel({   
    color:'#000000',
    height:32,
    left:5,
    top:34,
    fontSize:'14dp',
    backgroundColor:'transparent',
    text:'' + rows.fieldByName('distributor_address') + ''
    });

    var distance = Ti.UI.createLabel({  
    color:'#000000',
    height:32,
    right: 10,
    top:34,
    fontSize:'12dp',
    backgroundColor:'transparent',
    text:'' + rows.fieldByName('distance') + ''
    }); 

    row.add(title);
    row.add(address);
    row.add(distance);
    tableview.add(row);
    row.className = 'distributorRow';

    dataArray.push(row);
    rows.next();    
}

// set the array to the tableView
tableview.setData(dataArray);
}
}

Answer 1

You are right, 2 while loops are making problem. Also you need to add rows to dataArray : dataArray.push(row);

And then outside of while loop, set dataArray as data to tableView: tableview.setData(dataArray);

I just modified some of your code and it is working fine:

//Setup the window
var win = Titanium.UI.createWindow({
    backgroundColor: '#123456',
});

//install database
var db = Ti.Database.open('distributor');
try{
    db.execute('create table if not exists distributor(id varchar(10), distributor_name varchar(10), distributor_address varchar(10), distance varchar(10));');
    db.execute("Insert into distributor values('id1','name1','address1','distance1')");
    db.execute("Insert into distributor values('id2','name2','address2','distance2')");
    db.execute("Insert into distributor values('id3','name3','address3','distance3')");
    db.execute("Insert into distributor values('id4','name4','address4','distance4')");
    db.execute("Insert into distributor values('id5','name5','address5','distance5')");
}
catch(err)
{
    Ti.API.info(err.message);

}



// create table view
var tableview = Ti.UI.createTableView({
    backgroundColor:'transparent',
    color: '#000000',
    top:80,
    height:'auto',
    left:80,
    right:80,
    bottom:120
});

setData();
win.add(tableview);
win.open();


function setData() {
    //db.open();
    var rows = db.execute('SELECT * FROM distributor');
    //db.close();
    var dataArray = [];
    while (rows.isValidRow())
    {
        var row = Ti.UI.createTableViewRow({
            haschild: true,
        });
        var title = Ti.UI.createLabel({ 
            color:'#000000',
            height:32,
            left:5,
            top:2,
            font:{fontSize:'18dp',fontWeight:'bold' },
            backgroundColor:'transparent',
            text:'' + rows.fieldByName('distributor_name') + ''
        });
        var address = Ti.UI.createLabel({   
            color:'#000000',
            height:32,
            left:5,
            top:34,
            fontSize:'14dp',
            backgroundColor:'transparent',
            text:'' + rows.fieldByName('distributor_address') + ''
        });
        var distance = Ti.UI.createLabel({  
            color:'#000000',
            height:32,
            right: 10,
            top:34,
            fontSize:'12dp',
            backgroundColor:'transparent',
            text:'' + rows.fieldByName('distance') + ''
        });
        row.add(title);
        row.add(address);
        row.add(distance);
        dataArray.push(row);
        rows.next();     
    }
    tableview.setData(dataArray);
}