1

I found this post that seems to make an Ajax script work in an OOP model. I found it interesting to add the script via a class function rather than a different file, it would be very useful to me. However, I don't manage to enqueue the jQuery for Wordpress. I have a error: jQuery is not defined.

Here is my code:

class fiche_content{
    private $file_base; 
    private $jenkins_url;

    function __construct($jenkins_token){
         $this->file_base = plugin_dir_path( dirname( __FILE__ ) ) . 'fiche.php'; 
         $this->jenkins_url = $jenkins_url;

         $this->init(); 
    }

    function init() {
        add_action('wp_head', array( $this, 'js_scripts' ));
        add_action('wp_ajax_action_function', array( $this, 'action_function' ));
    }  

    function js_scripts(){
        $script = "
    <script type='text/javascript'>     
        jQuery(document).ready(function($) {
            $(document).on('click', '#launchBuildForm',function(e){
                var url =" . $this->jenkins_url . ";
                $.ajax({
                    method:'post',
                    url: url,
                    crossDomain: true,
                    dataType: 'jsonp',
                    data: {
                        'action': 'action_function'
                    },
                    success: function (msg) {
                        console.log(msg);
                        console.log('success');
                    },
                    error: function(jqXHR, textStatus, errorThrown){
                        console.log(jqXHR, textStatus, errorThrown);
                    }
                });
            });
        }); 
    </script>
        ";
        echo $script;
    }


    function action_function(){
        echo 'test';
        wp_die();
    }
  • Sounds like this runs before jQuery is loaded on the page – RiddleMeThis Mar 18 at 17:01
  • okk so I just gave up the idea of the script inside a class function and I put the script in an external file.. Thanks for your ideas all – Melinsuna Mar 19 at 9:43
-1

You are setting your script to be added at the wp_head action. jQuery, along with most other scripts, are loaded as part of the wp_enqueue_scripts action. Care to guess which of those comes first? ;)

Edit This is actually not true. jQuery is loaded as part of wp_default_scripts which does take place before wp_head

I have found this list of the WordPress hook firing sequence to be helpful. It shows that wp_head comes right before wp_enqueue_scripts. This means when your script is running jQuery has not been loaded yet.

Just change your line in your init function:

add_action('wp_enqueue_scripts', array( $this, 'js_scripts' ));

I would also recommend putting the script in an external file and then enqueue-ing it. That way, you can actually specify dependencies (like jQuery) as well as other options..

  • Still having the jQuery is not defined error. Any way to let this script into the class function and not into external file ? – Melinsuna Mar 18 at 17:09
  • What I said was incorrect. jQuery is loaded as part of a separate hook, wp_default_scripts which was already happening before your code. Are you sure jQuery is not being deregistered in some way? When you inspect your page, can you see jquery.js being loaded and where is it in relation to your script on the page? – tmdesigned Mar 18 at 17:32
  • wp_enqueue_scripts also runs before wp_head. It wouldn't be useful if it didn't. So that could never have been the issue. The issue is much more straightforward: They're not enqueueing jQuery anywhere in their code. So there's no reason to expect jQuery to be loaded. – Jacob Peattie Mar 19 at 0:47
  • You're right that it's not the issue (I had already edited the post with the correct info that jQuery is registered prior). I think you may also be right that jQuery is registered but not enqueued. I am so used to adding it as a dependency when needed that I forget it's not enqueued by default. By the way though, wp_head does fire before wp_enqueue_scripts - the list on the plugin API docs is out of date if that's what you're referencing. – tmdesigned Mar 19 at 1:38
  • So, Melinsula, to follow the suggestion @Jacob made, add wp_enqueue_script( 'jquery' ); to your constructor. – tmdesigned Mar 19 at 16:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.