CODEWITHSUNDEEP
javascriptjqueryjquery-mobilecordova
Demonofloom
Demonofloom

Reputation: 240

Calling External function from within function - Javascript

I am using Phonegap and JQueryMobile to create a web application. I'm new to javascript and am having an issue.

My issue is with calling a function I have in a file named "testscript.js", the function is called testFunc. The testscript.js containts only this:

function testFunc() {
    console.log("Yes I work");
}

Within my html page I have the following code:

<script>
  $('#pageListener').live('pageinit', function(event) 
    {
     testFunc();
    });
</script>

The test function is found within my "testscript.js" which I am including with this line within the head tags:

<script src="testscript.js"></script>

The error I get is a "testFunc is not defined".

I am assuming its some type of scope issue as I'm able to call other jquery functions such as:

alert("I work");

and I am able to call my functions by sticking them within script tags in the html elsewhere.

I've tried all sorts of ways of calling my function with no success, any help is appreciated!

Upvotes: 0

Views: 2282

Answers (2)

gopi1410
gopi1410

Reputation: 6625

You must include the testscript.js before the other jquery code in your html. Like this:

<script src="testscript.js"></script>

<script>
   $('#pageListener').live('pageinit', function(event) 
   {
      testFunc();
   });
</script>

Upvotes: 1

T.J. Crowder
T.J. Crowder

Reputation: 1074495

As long as testscript.js has been loaded by the time PhoneGap fires the pageinit event, and provided the testFunc function is a global, there's no reason that shouldn't work.

You haven't shown us your testFunc, but my guess is that it's not a global, but rather you have it inside something like, for instance:

$('#pageListener').live('pageinit', function(event) 
{
    function testFunc()
    {
        // Do something here
    }
});

or just a scoping function

(function() 
{
    function testFunc()
    {
        // Do something here
    }
})();

Either way, since it's declared within another function, it's local to that function, not global. To call it from another script file, you'll need to be able to get at it from the global namespace (sadly). The best way to do that is not to make it a global, but to create just one global that you'll put all of your shared stuff on, like this:

(function() 
{
    if (!window.MyStuff)
    {
        window.MyStuff = {};
    }
    window.MyStuff.testFunc = testFunc;

    function testFunc()
    {
        // Do something here
    }
})();

...which you call like this:

$('#pageListener').live('pageinit', function(event) 
{
    MyStuff.testFunc(); // Or: window.MyStuff.testFunc();
});

Upvotes: 1

Related Questions