CODEWITHSUNDEEP
javascriptjqueryhtml
FlyingCat
FlyingCat

Reputation: 14250

How to load a JS file via ajax?

I have something very weird happening in my app.

I need to load a JS through $.getScript because I need to load it dynamically.

If I load it through html like

<script src="http://otherproject/project/test.js"></script>

everything works.

However, if I load it through $.getScript(http://otherproject/project/test.js)

I got undefined is not a function error.

Here is my JS

test.js

Myproject = (typeof Myproject !== "undefined") ? Myproject : {};

Myproject.common = (typeof Myproject.common !== "undefined") ? Myproject
.common : {};

$(document).ready(function() {
    TEST = new Myproject.common.Init(); 
    // Uncaught TypeError: undefined is not a function here
});

Myproject.common.Init = (typeof Myproject.common.Init !== "undefined") ? Myproject
.common.Init : (function() {
//more codes…..

I don't know how to solve this as my brain really fried now. Can anyone help me about this? Thanks a lot!

Upvotes: 0

Views: 77

Answers (1)

Rafael
Rafael

Reputation: 7746

This is a shorthand Ajax function, you need to use callbacks since it is asynchronous 

$.getScript( "ajax/test.js", function( data, textStatus, jqxhr ) {
    console.log( data ); // Data returned
    console.log( textStatus ); // Success
    console.log( jqxhr.status ); // 200
    console.log( "Load was performed." );
});

Example callback structure above^

jQuery.getScript( url [, success ] ) <-- chain promises to make more call backs. or write your own.

$.getScript(http://otherproject/project/test.js)

^ this is not using a callback and not correct since your URL parameter is not of type String. Hence why your code doesn't know what the functions in it are...

jQuery Documentation for getScript

Upvotes: 1

Related Questions