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.

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..

share|improve this question
add comment

1 Answer

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;
    }
}
share|improve this answer
    
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 Susanto Aug 11 '13 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 '13 at 10:46
    
Awesome. It is perfect now! Thank you very much Chris.O :) –  Ari Susanto Aug 11 '13 at 14:22
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.