By samjco


2019-03-10 23:48:04 8 Comments

Trying to get this function to work. But keep getting a jQuery not defined error.

I have tried many variations here to get the jQuery to work: https://blog.templatetoaster.com/fix-jquery-is-not-defined-error/

add_action( 'load-post.php', function () { 

$status = "status-started";

if($status == 'status-started'):
    ?>
    <script>
        jQuery(document).ready(function($) { 
            /* write your JavaScript code here */
            $('.btn-start').trigger('click');
            console.log('Started successfully!');
        });
    </script>

<?php 
endif;

} );

2 comments

@butlerblog 2019-03-11 00:04:20

You have your jQuery hooked too early. The jQuery library has not yet loaded when the load-(page) action is fired.

Use admin_print_scripts to print inline scripts. That action comes after scripts are enqueued.

Here's your original code using admin_print_scripts:

add_action( 'admin_print_scripts', function () { 

$status = "status-started";

if($status == 'status-started'):
    ?>
    <script>
        jQuery(document).ready(function($) { 
            /* write your JavaScript code here */
            $('.btn-start').trigger('click');
            console.log('Started successfully!');
        });
    </script>

<?php 
endif;

} );

An alternative to using admin_print_scripts would be to use admin_print_footer_scripts, which is essentially the same thing, but in the footer instead of the header. Either is generally OK and whether you do it in the header or the footer is sometimes a matter of preference and sometimes a matter of necessity. So it will depend on the actual use case.

For anyone wondering why I didn't suggest using another hook such as wp_head or wp_footer, there are two reasons. First, it's not what those hooks were intended for. Using them would get your scripts out of sequence with where they really should be (although in a lot of cases they would work just fine). Second, they are not admin specific hooks. The question of a load-(page) action indicates this is an admin side process, so use the proper admin side hooks.

I would say similar things about the use of various "enqueue" hooks. First, don't use an enqueue that is not admin side specific (speaking specifically of this original post and not in generalities). Second, enqueueing is for libraries and static scripts. If you're printing out scripts (especially ones that may be dynamic), use the _print_scripts hooks instead.

@samjco 2019-03-11 00:42:28

But will admin_print_scripts fire on post edit load?

@butlerblog 2019-03-11 01:30:10

It fires on all admin pages (see: developer.wordpress.org/reference/hooks/admin_print_scripts)‌​. Note that it's not the only option, either. You could use admin_print_footer_scripts which does the same thing but in the footer.

@samjco 2019-03-12 17:08:28

Can you update your answer to include my code , just for other users?

@butlerblog 2019-03-12 20:47:06

Yes - I added your code with the admin_print_scripts hook, and also some additional explanations as to why I recommended the hooks I mentioned instead of others.

@mjprogramation 2019-03-10 23:58:13

You must call jQuery at the end of the file, when your document is ready.

Try to add the action to the wp_footer or use wp_enqueue_script .

Related Questions

Sponsored Content

1 Answered Questions

0 Answered Questions

AJAX POST Value not being returned - Wordpress - AutoTrader API

  • 2019-02-27 14:02:21
  • Andy Simpson
  • 38 View
  • 0 Score
  • 0 Answer
  • Tags:   ajax jquery json

0 Answered Questions

Json Ajax Response Error

  • 2019-02-26 20:38:00
  • Rob
  • 89 View
  • 0 Score
  • 0 Answer
  • Tags:   ajax jquery json

2 Answered Questions

Using JavaScript and JQuery in Page

3 Answered Questions

[SOLVED] How to load the WordPress jquery in the <head> section

  • 2013-08-25 16:28:13
  • John Doe
  • 18005 View
  • 3 Score
  • 3 Answer
  • Tags:   jquery

2 Answered Questions

[SOLVED] jQuery code not working when included in functions.php

1 Answered Questions

[SOLVED] Trouble enqueueing jquery with custom theme

1 Answered Questions

Loading custom file based on a dependant file that is also dependant on another file

  • 2015-11-22 20:51:52
  • user3290060
  • 95 View
  • 0 Score
  • 1 Answer
  • Tags:   jquery

2 Answered Questions

[SOLVED] ajax, right way to do it and make it works?

Sponsored Content