CODEWITHSUNDEEP
javascriptjqueryjquery-ui
ShadyBears
ShadyBears

Reputation: 4175

Getting a typeerror function does not exist error

Things to note:
I don't have access to HTML (rendered by an engine)
jQuery is included in the engine (which is why I don't include it in my code)

This code takes a link and injects it into the html:

$(document).ready(function(){
    addSS('https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css'); 
    addScript('https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js');
    addScript('//InjectedHTML.js');
});

function addScript(str){
    var script = document.createElement('script');
    script.src = str;
    document.head.appendChild(script);
};

function addSS(str){
    var link = document.createElement('link');
    link.rel= 'stylesheet';
    link.href = str;
    link.type= 'text/css';
    document.head.appendChild(link);
};

InjectedHTML puts datepicker into HTML (in a separate file from the code above):

$(document).ready(function() {
    addClass();                         //adds class attribute to an input that allows me to use datepicker function
    datePicker();                       //adds calendar
});
function addClass(){
    $("#DateWrapper input").attr("class", "datepicker");
};

function datePicker(){
    $( ".datepicker" ).datepicker();
};

Getting this error:
InjectedHTML.js:35 Uncaught TypeError: $(...).datepicker is not a function

Thanks for your help!

Upvotes: 0

Views: 288

Answers (1)

Josh
Josh

Reputation: 12722

Its been a few years since I've looked at the state of manually loading scripts into the DOM, but there is usually a variant of a loaded event that fires when the script has actually finished loading.

Generally there is something asyncronous about the process, because it has to go and fetch the file. This means they're likely not going to stop the execution of the javascript engine while this is happening. This means in some form of fashion you're looking at a callback.

There are various libraries for doing this. If you don't want to use them, go read the source and investigate the requirements of the platform you're targeting.

Stuff like this:

Looks like jquery even has some form of this: https://api.jquery.com/jquery.getscript/

Upvotes: 1

Related Questions