0

I am trying to figure out how to link a custom jquery to my custom meta box created in wordpress custom post type but I can't find it working.

What I want to do is add a line of text when the button is clicked. But it is only reload the "add new post" page and generating a message "Post updated." after I clicked the button.

Here is my code:

File: doubleit.js

jQuery(document).ready(function($){
  $("#btn1").click(function(){
    $("p").append(" <b>Appended text</b>.");
  });

  $("#btn2").click(function(){
    $("ol").append("<li>Appended item</li>");
  });
});

Register and Enqueue Script

add_action( 'admin_enqueue_scripts', 'add_mytweetjs' );

function add_mytweetjs() {

    wp_deregister_script('jquery');

    wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js');

    wp_register_script( 'myjquerydoubler', plugins_url( '/js/doubleit.js', __FILE__ ), array( 'jquery' ) );

    wp_enqueue_script( 'myjquerydoubler' );
}

HTML Script On The Custom Meta Box

echo '<p>This is a paragraph.</p>';
echo '<p>This is another paragraph.</p>';
echo '<ol>';
echo '<li>List item 1</li>';
echo '<li>List item 2</li>';
echo '<li>List item 3</li>';
echo '</ol>';
echo '<button id="btn1">Append text</button>';
echo '<button id="btn2">Append list items</button>';

May be somebody know where is the fault of my code above.

Thanks..

1 Answer 1

1

Because YOU CAN'T DEREGISTER JQUERY IN THE ADMIN

Why would you even want to?

See src: http://core.trac.wordpress.org/browser/tags/3.6/wp-includes/functions.wp-scripts.php?order=name#L105

// Do not allow accidental or negligent deregistering of critical scripts in the admin. Show minimal remorse if the correct hook is used.
if ( is_admin() && 'admin_enqueue_scripts' !== current_filter() ) {
    $no = array(
        'jquery', 'jquery-core', 'jquery-migrate', 'jquery-ui-core', 'jquery-ui-accordion',
        'jquery-ui-autocomplete', 'jquery-ui-button', 'jquery-ui-datepicker', 'jquery-ui-dialog',
        'jquery-ui-draggable', 'jquery-ui-droppable', 'jquery-ui-menu', 'jquery-ui-mouse',
        'jquery-ui-position', 'jquery-ui-progressbar', 'jquery-ui-resizable', 'jquery-ui-selectable',
        'jquery-ui-slider', 'jquery-ui-sortable', 'jquery-ui-spinner', 'jquery-ui-tabs',
        'jquery-ui-tooltip', 'jquery-ui-widget',
        'underscore', 'backbone',
    );

    if ( in_array( $handle, $no ) ) {
        $message = sprintf( __( 'Do not deregister the %1$s script in the administration area. To target the frontend theme, use the %2$s hook.' ),
            "<code>$handle</code>", '<code>wp_enqueue_scripts</code>' );
        _doing_it_wrong( __FUNCTION__, $message, '3.6' );
        return;
    }
}
  
3
  • Hi.. thank you! It works now! The only problem I get now is it is reload the page each time I click one of the buttons in the meta box.
    – Ari
    Aug 11, 2013 at 8:24
  • You need to use the event object on the click listener and call preventDefault(). jQuery("#some_div").click(function(event) { event.preventDefault(); //your code });
    – Chris_O
    Aug 11, 2013 at 10:46
  • Awesome. It is perfect now! Thank you very much Chris.O :)
    – Ari
    Aug 11, 2013 at 14:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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