Search code examples
javascriptandroidjquerycordovaappframework

"Uncaught TypeError: Property 'touchLayer' of object function ( selector, context )" when using afui and jquery on phonegap


I'm using phonegap for deploying a web application made in afui (Intel Appframework UI) for Android, but, when I test it in the android emulator the debug console shows me the following error after I have just started the app:

Uncaught TypeError: Property 'touchLayer' of object function (selector, context) 
    // The jQuery object is actually just the init constructor 'enhanced' 
    return new jQuery.fn.init( selector, context, rootjQuery ); 
} is not a function at file:///android_asset/www/ui/appframework.ui.js:3281

And all the javascript functionality is disabled.

I can't figure out what is the problem. I have tested the app in chrome over Elementary OS and it works fine.

I'm using phonegap 3.1.0-0.15.0, jQuery 1.10.2, and App Framework UI 2.0.

I'm importing the js files in this order:

<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script src="js/jq.appframework.js"></script>
<script type="text/javascript" charset="utf-8" src="ui/appframework.ui.js"></script>

I hope somebody can help me to find a solution to this.


Solution

  • I had this same problem. Eventually, looking at the index.html in the Appframework Kitchen Sink, I found out that to make the error disappear you need the following script inside the app index.html:

    var webRoot = "./";
    $.ui.autoLaunch = false; //By default, it is set to true and you're app will run right away.  We set it to false to show a splashscreen
    /* This function runs when the body is loaded.*/
    var init = function () {
            $.ui.backButtonText = "Back";// We override the back button text to always say "Back"
            window.setTimeout(function () {
                $.ui.launch();
            }, 1500);//We wait 1.5 seconds to call $.ui.launch after DOMContentLoaded fires
        };
    document.addEventListener("DOMContentLoaded", init, false);
    $.ui.ready(function () {
        //This function will get executed when $.ui.launch has completed
    });
    

    I don't know yet why this code is needed, but its use is also documented here.