Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

In the code below, unless I hardcode a reference to the jQuery library, my jQuery bits on the page do not work. What's wrong with the enqueue method I'm trying to use?

In functions.php:

if(is_admin())
{

/* LOAD ADMIN SCRIPTS
**********************************/
require_once(TEMPLATEPATH . '/functions_private.php');

}

In functions_private.php:

if( 'post.php' == $pagenow )
{

    add_action('admin_print_scripts', 'my_load_ui_script');

    function my_load_ui_script()
    {
    wp_enqueue_script('jquery');
    ?>
        <!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>-->
        <script>
        if(typeof jQuery!="undefined"){
            alert("You have jQuery loaded");//WILL NOT FIRE UNLESS I HARDCODE JQUERY INCLUDE
        }           

        jQuery(document).ready(function()
        {
        //jquery bits go here
        }

    }//END FUNCTION 

}//END IF
share|improve this question
    
As the question is about JS event listeners it's therefore off-topic. Close voted. –  kaiser Jan 13 '13 at 20:41
add comment

4 Answers

Use the admin_enqueue_scripts hook to add your own custom script. Put it in an external file, and use wp_localize_script to pass any data from php to javascript. jQuery is already used on the admin side, adding a script tag sourcing it from google will break things.

function wpa80418_admin_enqueue( $hook ) {
    if( 'post.php' != $hook )
        return;
    wp_enqueue_script(
        'my_custom_script',
        get_template_directory_uri() . '/js/myscript.js',
        array('jquery')
    );
}
add_action( 'admin_enqueue_scripts', 'wpa80418_admin_enqueue' );
share|improve this answer
    
I'm not trying to use my own script. I'm trying to use the wordpress copy of jquery. Unfortunately, its not working. When I replace admin_print_scripts with admin_enqueue_scripts it does not work either. –  Scott B Jan 13 '13 at 20:14
1  
Try the admin_footer hook –  diggy Jan 13 '13 at 20:15
    
+1 diggy! That works but now my script has apparently foobarred the wordpress admin. None of the panels will toggle open/close. My script works fine though. I'm getting a console error: Uncaught TypeError: Cannot call method 'toLowerCase' of undefined. Please post your answer so I can accept it. –  Scott B Jan 13 '13 at 20:24
1  
because you're adding your own copy of jquery from an external source, again, this will break the admin UI as you have seen. WordPress already comes with jQuery, it should already be included on most admin pages, as all the javascript in the admin UI uses it. don't inject script tags directly into the page, enqueue external files for your own scripts. –  Milo Jan 13 '13 at 20:54
add comment

WordPress jQuery does not support $ by default.

First Add jQuery.

function my_scripts_method() {
    wp_enqueue_script(array('jquery'));
}
add_action('admin_enqueue_scripts', 'my_scripts_method');

replace this code:

jQuery(document).ready(function()
        {
        //jquery bits go here
        }

with:

jQuery(document).ready(function($) {
    // $() will work as an alias for jQuery() inside of this function
});
share|improve this answer
    
I'm not using the $ character in my jquery code, so this is not really pertinent to the question. My problem is that jquery is not loading at all (see updated question) –  Scott B Jan 13 '13 at 19:32
    
see updated answare! –  Furqan Jan 13 '13 at 19:41
add comment

The admin_footer hook proves to be the right hook for Scott B's code. However, it is generally recommended to enqueue scripts (and declare their jQuery dependency) as described in the answer of @Milo

share|improve this answer
add comment

Event listeners

Simple:

  • The script executes immediately when you run it, as it doesn't use any javascript event listener like waiting until the DOM or the window or whatever loaded.
  • The enqueued script (jQuery) will be rendered on its appropriate hooks: In the head or - if enqueued mid-page - in the footer.

Therefore jQuery is simply not available when you call it.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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