0

I'm writing some javascript code which first retrieves some data form the database (function $.get()) and then performs some calculations on the data - using CalcModule() with static properties to pass on the data to a function Test(). Via the console I see that the static properties (productname, productid) are set (within $.get()), but via the console I also see that these values are still not accessible (visible) for function Test()??

What am I doing wrong? (I checked a few sites about static properties suchs as http://elegantcode.com/2011/01/19/basic-javascript-part-7-static-properties-and-methods/, but I can still not fin the problem)

the code:

$(document).ready(function () {


    function CalcModule() {};

    //static variables
    CalcModule.nrofeproducts;
    CalcModule.productid = [];
    CalcModule.productname = [];


    //get the product data from the database
    $.get("getdata.php",
        function (msg) {
            //some code here...

            //load CalcModule with retrieved db values for calculation
            for (var i = 0; i < msg.nrofeproducts; i++) {
                CalcModule.productid[i] = msg.productid[i];
                CalcModule.productname[i] = msg.productname[i];
            }

            //for debugging purposes
            console.log(CalcModule.productname);
            console.log(CalcModule.productid);

        }, "json"); //$.get()

    function Test() {
        var x = [];
        x = CalcModule.productname;
        console.log(CalcModule.productname);
    }

    Test();
})
Pointy
  • 405,095
  • 59
  • 585
  • 614
Joppo
  • 715
  • 2
  • 12
  • 31
  • 2
    Possible duplicate of [how to return from an AJAX call?](http://stackoverflow.com/q/14220321/1348195). – Benjamin Gruenbaum Aug 06 '13 at 16:29
  • 1
    The ajax call is asynchronous, yet your code expects the results to be available immediately. – Pointy Aug 06 '13 at 16:31
  • …and see [Is Chrome's JavaScript console lazy about evaluating arrays?](http://stackoverflow.com/questions/4057440/is-chromes-javascript-console-lazy-about-evaluating-arrays) for why you're seeing the values in the console – Bergi Aug 06 '13 at 16:31
  • 1
    Btw: use `var calcModule = {}`, there's no reason to let this be a function object. – Bergi Aug 06 '13 at 16:32
  • thnx for the comments. With respect to the comment about the ajax call - this may be correct. But what if my function Test() would be triggered by a clickevent? (e.g. ). I just tried that (while putting Test() outside doument ready() ) and it seems from the console that the CalcModule is not recognised by Test() (message: "Uncaught ReferenceError: CalcModule is not defined") – Joppo Aug 06 '13 at 16:50
  • @user2543182: Correct, your `CalcModule` symbol is defined within a function, and so it's not a global. – T.J. Crowder Aug 06 '13 at 21:25

1 Answers1

0
 $.get("getdata.php",
    function (msg) {
        //some code here...

        //load CalcModule with retrieved db values for calculation
        for (var i = 0; i < msg.nrofeproducts; i++) {
            CalcModule.productid[i] = msg.productid[i];
            CalcModule.productname[i] = msg.productname[i];
        }

        //for debugging purposes
        console.log(CalcModule.productname);
        console.log(CalcModule.productid);

        // We are guaranteed that $.get is done
        Test();

    }, "json"); //$.get()

    function Test() {
      var x = [];
      x = CalcModule.productname;
      console.log(CalcModule.productname);
    }

    // If we call Test() here, $.get will not be done yet.
Lior Cohen
  • 8,985
  • 2
  • 29
  • 27
  • *"If we call Test() here, $.get may not be done yet."* "may" => "will" – T.J. Crowder Aug 06 '13 at 16:33
  • Modified answer, thanks for feedback. It is likely that the $.get callback will never be called before Test(). Need to check if jQuery defers callback execution to the next "tick" or if this is a browser behaviour. Interesting. – Lior Cohen Aug 06 '13 at 16:36
  • thnx for the response. As mentioned in my previous comment Test() is actually triggered by a click event (sorry, I should have mentioned that at the start!) so I assume the callback mechanism is not needed. Nevertheless, still doesnt work as indicated my previous comment – Joppo Aug 06 '13 at 16:58
  • @LiorCohen: It's not "likely," it's guaranteed. :-) `$.get` is asynchronous. Even if the request completes instantaneously and the browser queues the callback, the call to the callback will wait until the current function finishes running. This is guaranteed by the environment, it's not a jQuery thing. – T.J. Crowder Aug 06 '13 at 17:02