Wordpress Plugin Not Loading Javascript File

Question

I am creating/learning about wordpress plugins and I have created one that adds a meta box to the edit post page. However, I can't seem to get the plugin to load my .js file.

<?php
   /*
   Plugin Name: Adams The The Plugin
   Plugin URI: http://adamthings.com
   Description: Plugin attempt...
   Version: 1.0
   Author: Adam
   Author URI: http://adamthings.com
   License: GPL2
   */

   function my_scripts_method() {
        wp_enqueue_script('the_js', plugins_url('/AdamsTheThePlugin.js',__FILE__) );
    }

    add_action( 'wp_enqueue_scripts', 'my_scripts_method' );

    add_action( 'add_meta_boxes', 'cd_meta_box_add' );

    function cd_meta_box_add()
    {
        add_meta_box( 'my-meta-box-id', 'Adams The The Plugin', 'cd_meta_box_cb', 'post', 'normal', 'high' );
    }

    function cd_meta_box_cb( $post )
    {
        $values = get_post_custom( $post->ID );
        $postid = get_the_ID();
        $content = get_post_field('post_content', $postid);

        wp_nonce_field( 'my_meta_box_nonce', 'meta_box_nonce' );
?>

    <p>
        <label for="my_meta_box_text" id="adamsPostContent">Post Content</label>
        <textarea name="my_meta_box_text" id="my_meta_box_text"><?php echo $content; ?></textarea>
    </p>


<?php   
    }
?>

Then my JavaScript file is in the same directory as the plugin is and looks like:

jQuery(document).ready(function () {
    jQuery("#adamsPostContent").css('color', 'red');
});

From other posts it seems like I am doing it correctly. Thoughts?

I would expect the label adamsPostContent to turn red on load.

Answer 1

It looks like you are building and admin-side plugin, but you are enqueueing the JS file in the front-end. You need to use the admin_enqueue_scripts action hook, so your call will look like this:

add_action( 'admin_enqueue_scripts', 'my_scripts_method' );