Question

I’ve included Jquery & Jquery mobiles latest versions.

I’m basically trying to use a mobile button to call a JavaScript function but having issues.

This works fine in chrome but not in webworks on the playbook (this is where i get the errors)

<script type="text/javascript" src="js/personSearch.js" ></script>

Including my custom JavaScript code

Within that file i have the folllowing code

    function testme()
{
    alert("tet");
}

I’ve tried all the following ways:

<input type="button" onclick="testme();" value="Button" />
<a id="psClear" href="javascript:testme();" data-role="button" data-inline="true">Clear</a>

For them all I get the error:
mainMenu.html:1ReferenceError: Can’t find variable: testme

I think its something to do with the way J query Mobile renders buttons but not sure…

UPDATE

If i add rel=”external” to the page before it loads in the javascript and works fine, but reloads all the scripts again, and doesnt work without rel=”exnteral”

    <link  rel="stylesheet" type="text/css" href="css/jqueryMobileCSS.css">
    <link  rel="stylesheet" type="text/css" href="css/customStyle.css">
    <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/jqueryMobile.js"></script>
    <script src="js/eBar.js"></script>
    <script src="js/moment.min.js"></script>
    <script src="js/ain.js"></script>
    <script src="js/tleBar.js"></script>
    <script type="text/javascript" src="js/ps.js" ></script>

So without rel=”external” js/ps.js doesnt seem to load…
The scripts located on both pages are the exact same but the new page has js/ps,js loaded in aswell..
Thanks

Answer 1

Don’t use inline Javascript (read why here) to call functions. It looks like the error you’re having is related to the fact that your personSearch.js file hasn’t loaded and therefore the function may not exist exist. Use the Chrome/Firebug JS console to check whether the function is definitely defined and then create another script with something resembling the following inside:

$(document).bind('pageinit',function () {
    $("#psClear").on('click',function(){
      testme();
     });
});

This will make sure that the DOM is loaded and ready before binding the click event to your button. Make sure this script is loaded after your personSearch.js script.