tablewview

hi to all !!i have a question i have a tablewview with rows...eveything is working just fine....my question is I'm stuck on a image i want to add like a header...i have the code working but no image shows..can someone please give me a hand???

var win1= Titanium.UI.currentWindow;
 
//here is the image i want to put as a header
var image = Ti.UI.createImageView({
    image:'61.jpg',
    top:0,
    height:200
    ,
    width:320,
 
 
});
 
 
var tableView = Ti.UI.createTableView({
    data : [{
        title : 'Location # 1',hasDetail:true,selectedColor:'red'
    }, {
        title : 'Location# 2',hasDetail:true,selectedColor:'red'
    },{
        title:'Location # 3',hasDetail:true,selectedColor:'red'
 
    },{title:'email'
    }]
}); 
 
   tableView.addEventListener('click', function(e){
 
    if (e.index == 0){
        //Click al primer RoW
        var newWindow = Ti.UI.createWindow({
            title : 'Location # 1',
            backgroundColor : 'white',
            url:'location1.js'
});
 
var backBtn = Ti.UI.createButton({ title : 'Back' });
 
backBtn.addEventListener('click', function(){
    newWindow.close();
});
newWindow.setLeftNavButton(backBtn);
        newWindow.open({
            modal : true,
            animated :true
        });
    }
 
    if (e.index == 1){
        //Click al segundo RoW
        var newWindow = Ti.UI.createWindow({
            title : 'Location # 2',
            backgroundColor : 'white',
            url:'location2.js'
 
        });
        var backBtn = Ti.UI.createButton({ title : 'Back' });
 
backBtn.addEventListener('click', function(){
    newWindow.close();
});
newWindow.setLeftNavButton(backBtn);
        newWindow.open({
            modal : true,
            animated : true
        });
       }
        if (e.index == 2){
        //Click al segundo RoW
        var newWindow = Ti.UI.createWindow({
            title : 'Location # 3',
            backgroundColor : 'white',
            url:'location3.js'
 
        });
        var backBtn = Ti.UI.createButton({ title : 'Back' });
 
backBtn.addEventListener('click', function(){
    newWindow.close();
});
newWindow.setLeftNavButton(backBtn);
        newWindow.open({
            modal : true,
            animated : true
    });
}
if (e.index == 3){
        //Click al segundo RoW
        var newWindow = Ti.UI.createWindow({
            title : 'email',
            backgroundColor : 'white',
            url:'email.js'
 
        });
        var backBtn = Ti.UI.createButton({ title : 'Back' });
 
backBtn.addEventListener('click', function(){
    newWindow.close();
});
newWindow.setLeftNavButton(backBtn);
        newWindow.open({
            modal : true,
            animated : true
});
 
}
});
 
    win1.add(image);
    win1.add(tableView);
   win1.open();

You can add an image to a header by using Ti.UI.TableViewSection together with the headerView property:

var win = Ti.UI.createWindow();
 
var tableData = [];
 
var sectionData = [{
    title : 'Location # 1',
    hasDetail : true,
    selectedColor : 'red'
}, {
    title : 'Location# 2',
    hasDetail : true,
    selectedColor : 'red'
}, {
    title : 'Location # 3',
    hasDetail : true,
    selectedColor : 'red'
 
}, {
    title : 'email'
}];
 
var header = Ti.UI.createView({
    backgroundColor : '#ff0000',
});
 
//here is the image i want to put as a header
var image = Ti.UI.createImageView({
    image : 'KS_nav_ui.png',
    left:10,
    height : 20,
    width : 20,
});
 
header.add(image);
 
var section = Ti.UI.createTableViewSection();
section.headerView = header;
 
tableData[0] = section;
 
for (var i = 0; i < sectionData.length; i++) {
    var r = Ti.UI.createTableViewRow(sectionData[i]);
    section.add(r);
}
 
var tableView = Ti.UI.createTableView({
    data : tableData
});
 
win.add(tableView);
win.open();