jQuery.cookies won't load dynamically (with jQuery getScript etc)

Question

I am trying to create a session deletion method for cookies on logout.

Cookies with a certain start key need to be deleted, so I have made a little javascript that works.

Trying to keep all my Logout code in one place, I am trying to added the Javascript dynamically.

In my Code Behind, I am doing the following:

    Dim logoutJS As String = ""
    logoutJS += "function loadJQuery(callback) {  "
    logoutJS += "var addJquery = document.createElement('script'); " '// add jQuery to document
    logoutJS += "addJquery.onload = callback;  "
    logoutJS += "addJquery.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'; "
    logoutJS += "document.getElementsByTagName('head')[0].appendChild(addJquery); "
    logoutJS += "  }; "
    logoutJS += "function loadCookies() { " '// now jQuery is loaded we can used getScript
    logoutJS += "$.getScript('/Scripts/jquery_cookies_min.js', deleteCookies()); "
    logoutJS += "  };"
    logoutJS += "function deleteCookies() { "  
    logoutJS += "var cookieSettings = $.cookies.filter(/^hgAdmin/); "
    logoutJS += "$.each(cookieSettings, function (cookieName, content) { "
    logoutJS += "$.cookies.del(cookieName); });        "
    logoutJS += "window.location = ('/login.aspx'); };"
    logoutJS += "loadJQuery(function() { loadCookies(); }); "

    Common.logOut(Session)
    ScriptManager.RegisterStartupScript(form1, GetType(HtmlGenericControl), "form1", logoutJS, True)

Obviously logoutJS is the Javascript to be called when the logout page loads, this then redirect back to login.

When manually inserted into the page and physically coding the inserted JS files, this works fine.

However, when dynamically inserted, the $.getScript('/Scripts/jquery_cookies_min.js', deleteCookies()); is not working correctly.

The problem is, the jquery_cookies_min.js file is NOT loaded when the callback to run deleteCookies is fired so I get an console error cannot call method 'filter' of undefined.

If I change the script loaded by getScript to a different script, another copy of jQuery for example, then it loads (I can see the Chrome Network console shows jQuery laoded twice), but it won't load this Cookies file.

I have checked and double checked a million times that the location is correct... and indeed, it works if I manually include the JS file... I've also tried without the preceding /

Why is this script not loading?!

EDIT: I have also tried with the appendChild element method as per the manner in which I am loading jQuery... same result

Answer 1

Because your second param is a function call, not a function definition or reference.

Try removing the () from deleteCookies() or use:

$.getScript('/path', function () { deleteCookies() });