ChildBrowser onLocationChange not working

Question

Basically I am using ChildBrowser on iOS, it works almost perfectly. The problem is the onLocationChange, onClose and onOpenExternal don't work and for the life of me I can't figure out why.

Any help would be much appreciated

<script type="text/javascript" charset="utf-8">
    var cb;
    function onBodyLoad()
    {
        document.addEventListener("deviceready",onDeviceReady,false);
    }
    /* PhoneGap has been initialized and is ready to roll */
    function onDeviceReady()
    {
        console.log("Device Ready");
        cb = ChildBrowser.install();
    }

    function openChildBrowser(url)
    {
        console.log("New Url"+url);
        try {
            cb.showWebPage(url);
            cb.onLocationChange = function(loc){ root.locChanged(loc); };
            cb.onClose = function(){root.onCloseBrowser()};
            cb.onOpenExternal = function(){root.onOpenExternal();};
        }
        catch (err)
        {
            alert(err);
        }
    }

    function onCloseBrowser()
    {
        console.log("closed");
        alert("In index.html child browser closed");
    }

    function locChanged(loc)
    {
        console.log("new loc:"+loc);
        childBrowser.close();
        alert("In index.html new loc = " + loc);
    }

    function onOpenExternal()
    {
        console.log("new loc:");
        alert("In index.html onOpenExternal");
    }
</script>

I have tried window.plugins.childBrowser.onLocationChange ect.

Answer 1

take out the root.onlocationChange, no need to have that.

Answer 2

Encapsulate the locChanged, onCloseBrowser, onOpenExternal into a main function to make correct calls because childbrowser when it´s opened doesn't have the scope of locChanged for example:

var facebook = function() {
    locChanged = funciton() {
        //your code here
    }
    return {
        "init": init,
        "locChanged": locChanged,
        "onCloseBrowser": onCloseBrowser,
        "onOpenExternal": onOpenExternal
    }
}();