• I’m using some javascript written by a previous site-builder for an html site. I did get it to work in the past, but something changed and I can’t get the javascript file to load and work. The path to the file appears correct, but the console says “failed to load…”

    I tried to load the file within the post and in the header, neither worked.

    The javascript file contains a function like this:

    var co = new Object;
    function recalc_onclick(ctl) { if...etc

    In the codex it says

    For the occasional or one time use of JavaScript, you need to put the script into a JavaScript file, and then call it out from within the post. Make sure that each script is defined by its function name, such as:

    I’m not sure what that means?

    the function is called within the post like this

    <script language="javascript" type="text/javascript">
     function reset_onclick(x){document.formc.reset();postcode();recalc_onclick('');};function postcode(){document.formc.p3C45.value="John/Jane Doe";document.formc.p3C46.value="Company Name";document.formc.p3C47.value="email @ domain.com";};function eequerystring(){var querystring=document.location.search;if(querystring.length>0){variables=(querystring.substring(1)).split("&");var variable;var key;var value;for(var ii=0;ii<variables.length;ii++){variable=variables[ii].split("=");key=unescape(variable[0]);value=unescape(variable[1]);if(document.formc[key]!=null){document.formc[key].value=value;}}}}function initial_update(){postcode('');eequerystring();recalc_onclick('');}
    </script>

    It’s doing a whole bunch of math to fill in a table based on input values(there are some default values).

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    “Failed to load” has to be the external file. If the path is correct the only thing I can think of that prevents loading is the wrong permissions for the file or folder.

    I’m not sure why but defining JS functions in script blocks on the page does not always seem to work well. Adding your own external file reference on the page is definitely wrong for JS with WP, but would not cause a fail to load error AFAIK. I suggest doing things correctly before getting to excited about errors. If the errors still persist after doing things correctly, at least no one can say you referenced the file incorrectly.

    First I would go ahead and move all of the function declarations onto the external file just for good measure. Then you must reference the external JS file with wp_enqueue_script(). Getting the path spec right can be tricky, but it is easily verified on the post page in the browser’s source view.

    What the Codex is saying is even though the code inside a post could possibly be executed without a function declaration, because one is using an external file to contain the code, all code must be inside a function declaration. I personally don’t think this is a good approach because it bypasses the wp_enqueue_script() step. It obviously will work in some cases, and ensures the JS file is loaded only when needed.

    I’d rather use PHP to decide to load a script or not. It may cause the script to sometimes load needlessly, but that doesn’t bother me. Any JS app large enough to be an issue will probably be needed on most posts, so there is no benefit from selective loading.

    Thread Starter claybaby

    (@claybaby)

    thanks for the lengthy reply. I have a number of follow-up questions, maybe you can help.
    1. wp_enqueue_script(): I looked at the codex page and this guy’s page. I think I have an idea what’s needed for the wp_enqueue_script(), but how do I use it? Can I just <?php wp_enqueue_script('$handle, etc)?> in the header?
    On the page linked above he starts talking about wp_print_scripts. Huh? I sense a rabbit hole, though maybe I just need to dive in and learn this stuff.
    2. This maybe out of this site’s scope, but I actually have 6 different javascript “calculators” and six similar on-page scripts to call the functions in said calculators. I can’t call each script b/c they each call the ‘onclick’ event but with different variables… Maybe I just answered my own question: enqueue the functions, call the script on the page.

    The deeper I get into development the more I realize using another person’s work is way more challenging than creating stuff from scratch.

    Moderator bcworkz

    (@bcworkz)

    Oh yeah, there’s a really deep rabbit hole here! Fortunately, you can get away often enough with kneeling on the edge and peering in. Always a risk of falling in though!

    All you really need to know is to get external files referenced in head or footer you need to enqueue the script. An no, you cannot just call wp_enqueue_script() when your plugin or theme loads. The function must be called from one of a few action hooks. See the Notes section of the Codex entry for hooks, and the first example under Using a Hook for a typical enqueue hook.

    Done correctly, all the proper external references will appear on your page. You don’t really need to understand how it happens, but if you care, wp_print_scripts() is involved. It’s all dealt with by WP core, your responsibility ends when you call wp_enqueue_script().

    You probably did answer your own question. Also be aware you can often selectively enqueue one script or another depending on what page is being loaded. The global $wp_query is a good resource for determining what is being requested, as are the many template tags like is_home(), is_archive(), is_single() etc.

    Dealing with poorly written existing code is a complete nightmare! Sometimes starting over is not a bad idea. OTOH, well organized, cleanly written code that was built intentionally for easy maintenance and customization can save you weeks of tedious coding.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘javascript fail to load’ is closed to new replies.