Javascript: Random "Object has no method" error even with jquery.getScript()

Question

I've been working with JavaScript and i need to call a function from another .js file.

The code works most of the time, but sometimes it gives me the error "Object has no method odometer". I've even put the code inside a call to getScript() to make sure it's loaded before it tries to call the odometer() function, but I'm still getting random errors.

Heres the code:

var updateDisplay = function(){
    console.log("refreshing Odometers");
    $.getScript("/odometer.js", function(){
        $.getJSON(
            '/getData',
            {
                product: '',
                unit: unitSelection(),
                period: salesPeriod(),
                reportBegin: $("#datepickerfrom").val(),
                reportEnd: $("#datepickerto").val()
            },
            function(data){
                    $(".odometer").odometer({
                        odometerData:data
                    });
            });
    });
};

I am getting an error on this line:

$(".odometer").odometer({
    odometerData:data
});

It says "object has no method odometer".

I am using the Play framework for development and I've already imported jQuery and my other JavaScript files in the HTML page.

Here's my JS import order:

jquery
odometer.js (even i use getScript, i've put it there just to make sure)
main.js (which the given code resides in..)

What am I doing wrong?

Thanks for helping....

You should tell us where you get the "Object has no method" error. (Which line of code) — RustyTheBoyRobot
– RustyTheBoyRobot, Commented May 23, 2012 at 13:57
sorry i missed that. i am getting error on "$(".odometer").odometer" line. which is illogical because i've already loaded that function with odometer.js. — dreampowder
– dreampowder, Commented May 23, 2012 at 15:00
I'm seeing a couple different odometer libraries; which are you using? — RustyTheBoyRobot
– RustyTheBoyRobot, Commented May 23, 2012 at 15:33
i think its a custom library, i've got that js from our design team.. — dreampowder
– dreampowder, Commented May 24, 2012 at 8:10

Ranganadh Paramkusam · Accepted Answer · 2012-05-23 18:59:57Z

1

I think

$(".odometer").odometer({...})

is called before odometer extends to jQuery, flow may be like this

$(".odometer").odometer({...});     // first called
$.fn.odometer = function(){...};    // later it was extended to jQuery

answered May 23, 2012 at 18:59

Ranganadh Paramkusam

4,3882 gold badges24 silver badges33 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Bergi Over a year ago

No, it is not. The loaded script will be executed before the sucess function

dreampowder Over a year ago

i've seen posts about firebird browser may have some issues with getScript function like running the success function before fetching the script. but its also happening in chrome browser too.

dreampowder Over a year ago

i guess i've found the answer, i'will tell you when i try this: stackoverflow.com/questions/8538139/jquery-ajax-bug

Community · Accepted Answer · 2017-05-23 12:11:28Z

1

seems like its a problem with ajax caching settings.

i've found the answer from this question:

jquery ajax bug

after adding

$.ajaxSetup({ cache: true });

the getScript works fine. thanks for spnding your time guys :)

edited May 23, 2017 at 12:11

CommunityBot

11 silver badge

answered May 24, 2012 at 10:29

dreampowder

1,6533 gold badges26 silver badges42 bronze badges

1 Comment

dreampowder Over a year ago

Also i've learned that, modern browsers can get 6 remote files at once (including css and js files). so combining js files into one file could be another solution.

Collectives™ on Stack Overflow

Javascript: Random "Object has no method" error even with jquery.getScript()

2 Answers 2

3 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related