My global variable comes up as undefined in transcationSuccess callback - can't figure out why

Question

Im working with Sencha touch and I am trying to update a panel after I get the data from my webdb... wouldnt think this would be hard but I am totally missing something here...

var returnHTML = getPresentations();

function getPresentations() {
returnHTML = "<ul>";

db = openDatabase("myDB", "", "TheDB", 500000);     
db.transaction(
    function (tx) {
        tx.executeSql("SELECT title FROM Presentations",
            [],
            function (transaction, results) {
                var returnHTML = "<ul>";
                for (var i = 0; i < results.rows.length; i++) {
                    returnHTML += "<li>" + results.rows.item(i).title + '</li>';
                }
                returnHTML += "</ul>";
            },
            onError);
    },
        onTransactError,
        onTransactSuccess);
}

function onTransactSuccess() {
    alert(returnHTML);
    console.log(returnHTML);
    extPanel.update();
}

But returnHTML keeps coming back as undefined... not really sure what is happening here.

I watch it go through my SELECT function... its a complete string before its done. What am I missing?

James Hill · Accepted Answer · 2011-10-31T16:49:32.200

5

There are several issues here. The first is an issue of scope. You're creating a new returnHTML within the scope of your function by using the var keyword. Remove the var keyword inside of your function so you're setting the previously created instance of returnHTML

This:

var returnHTML = "<ul>";

Should be:

returnHTML = "<ul>";

In addition, it appears that you're not actually returning the value of returnHTML from your function. Simply add return returnHTML to the end of your function.

...
},
        onTransactError,
        onTransactSuccess);

    //Add this line
    return returnHTML;
}

edited Oct 31 '11 at 16:49

answered Oct 31 '11 at 16:40

James Hill

60,353
20
145
161

It's not so much an issue of scope as an issue of assigning the result of a function that doesn't return anything. – Tim Rogers Oct 31 '11 at 16:44
@TimRogers, I believe it's both an issue of scope and of the function not returning a result. – James Hill Oct 31 '11 at 16:49
wow, i worked HARD at screwing this up... I wasn't returning anything because I am manipulating the global. since I was changing the global variable, it wouldnt matter. But I can see how screwy this thing looks. – Todd Vance Oct 31 '11 at 17:25

score 0 · Answer 2 · answered Oct 31 '11 at 16:43

On your first line, you are assigning the result of getPresentations to returnHTML. But you don't return a value from this function, so the result is undefined.

So either call the function to set the result into the global variable (i.e. remove the assignment), or return the result from the function and assign it (i.e. add a return statement to the function).

score 0 · Answer 3 · answered Oct 31 '11 at 16:46

I think that this line also might need changing.

returnHTML += "<li>" + results.rows.item(i).title + '</li>';

To

returnHTML += "<li>" + results.rows.item(i).title + "</li>";

As i think double quotations and single quotations will have different meanings in this instance.

If anything to keep it consistant too.

My global variable comes up as undefined in transcationSuccess callback - can't figure out why

3 Answers3