0

We use the latest versions of WordPress with the Woocommerce plugin. I'm searching for the best way to apply jquery to custom post types such as WC. I have a lot of hooks already for Woocommerce, so for now I have added some jquery into a meta box that I have previously added to the edit.php page. For instance, I'm using jquery to click on the address buttons to display all the address fields and to hide the Refund button from non-admin users upon loading the page. I'm sure there must be a better apply jquery as I'm doing now below?

add_action( 'add_meta_boxes', 'my_add_meta_boxes' );
function my_add_meta_boxes(){
add_meta_box(
    'woocommerce-order-my-custom',
    __( 'My Meta Box' ),
    'order_my_custom',
    'shop_order',
    'side',
    'default'
);
}
// Add fields to the metabox
function order_my_custom( $post ){
//<code omitted that places fields in meta box>
?>
<script type="text/javascript">
    jQuery(document).ready(function ($) {
        $(".edit_address").click();
        $(".add-line-item").click();
    });
</script>
<?php
}

I have used admin_enqueue_scripts to add my own common jquery functions, but what is the best way to add your own jquery to a specific post type?

  • Actually, I want to apply the jquery to post.php and post-new.php for a specific post type. – Robert Fitzpatrick Nov 10 '15 at 18:29
1

The previous answer works good with my example above using this hook:

add_action( 'admin_head', 'woocommerce_admin_init' );
function woocommerce_admin_init() {
    $screen = get_current_screen();
    if ( $screen->post_type == "shop_order" ) {
    ?>
    <script type="text/javascript">
        jQuery(document).ready(function ($) {
            $(".edit_address").click();
            $(".add-line-item").click();
        });
    </script>
    <?php
    }
}
| improve this answer | |
0

You can use the get_current_screen() function...it returns an object that contains lots of useful information about the screen that you are viewing inside of wp-admin.

For your purposes you'll want the post_type property of that object which will return the post type that the current admin screen is working with.

<?
$screen = get_current_screen();
if ( $screen->post_type == "ENTERYOURPOSTTYPE" ) {
?>
    <script>
        JAVASCRIPT HERE
    </script>

<?
}
?>

In your specific example you'll want to add the javascript where I've indicated and then attach that function to the admin_head hook.

add_action( 'admin_head', 'woocommerce_admin_init' );

function woocommerce_admin_init() {

    $screen = get_current_screen();

    if ( $screen->post_type == "shop_order" ) {
    ?>

        <script type="text/javascript">
            jQuery(document).ready(function ($) {
                $(".edit_address").click();
                $(".add-line-item").click();
            });
        </script>

    <?php
    }

}

Reference: http://codex.wordpress.org/Function_Reference/get_current_screen

| improve this answer | |
  • Please add proper explanations to your code, like how it works and where to use it. Your answer should be a reference to everyone, not just the OP – Pieter Goosen Nov 10 '15 at 18:50
  • Yeah, where to use it would be great. Now that I know how to apply the jquery, which hook should I put it in for this purpose? – Robert Fitzpatrick Nov 10 '15 at 18:52
  • Sorry, I was a little hasty with my response, I've updated it. Like you posted below, use it inside of the admin_head hook to add that code to the head of the admin screen for your specific post type. – Dan Wist Nov 11 '15 at 19:02

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.