Hide a custom action button on click displaying a text in WooCommerce admin orders list

user_13824850 0
Viewed 324

I am creating woocommerce plugin to send order details via WhatsApp. Here is my plugin code

add_filter( 'manage_edit-shop_order_columns', 'dvs_whatsapp_msg_list_column' );
function dvs_whatsapp_msg_list_column( $columns ) {
    $columns['dvs_show_whatsapp'] = 'WhatsApp';
    return $columns;
}
 
add_action( 'manage_shop_order_posts_custom_column', 'dvs_whatsapp_msg_list_column_content' );
function dvs_whatsapp_msg_list_column_content( $column ) {
    global $post;
    if ( 'dvs_show_whatsapp' === $column ) {
        $order = wc_get_order( $post->ID );
        $firstname = $order->get_billing_first_name();
        $lastname = $order->get_billing_last_name();
        $phone = $order->get_billing_phone();
        $ordernum = $order->get_order_number();
        $total = $order->get_total();
        $payment = $order->get_payment_method_title();
        $country = $order->get_billing_country();
        $calling_code = WC()->countries->get_country_calling_code($country);
        $whatsappnum = $calling_code.$phone;

        $msg = 'Hello ' .$firstname. ' ' .$lastname. ', your order #' .$ordernum. ' has been received. The order amount is ' .$total. '. Your payment method is ' .$payment.  '. Please contact us if you have any question regarding your order. Thank you.';
        
echo '<a href="https://wa.me/' .$whatsappnum. '?text=' .urlencode($msg).'" target="blank" class="dvs-whatsapp-btn">Send WhatsApp</a>';
    }
}

This is output enter image description here

I want when shop manager or admin click the Send Whatsapp link then it will hide the link and show Message sent so shop manager or admin can know the details of this msg is already sent.

Please help.

orders woocommerce backend wordpress php
2 Answers

Javascript is not the way to achieve this. You will use the following instead to hide the link and display "Message sent" once an external link has been clicked:

add_filter( 'manage_edit-shop_order_columns', 'dvs_whatsapp_msg_list_column' );
function dvs_whatsapp_msg_list_column( $columns ) {
    $columns['whatsapp'] = __('WhatsApp', 'woocommerce');
    return $columns;
}

add_action( 'manage_shop_order_posts_custom_column', 'dvs_whatsapp_msg_list_column_content' );
function dvs_whatsapp_msg_list_column_content( $column ) {
    if ( 'whatsapp' === $column ) {
        global $the_order;

        if( ! $the_order->get_meta('_wapp_sent') ) {
            echo '<a href="?post_type=shop_order&send=dvs_whatsapp&order_id=' . $the_order->get_id() .' target="blank" class="dvs-whatsapp button">' . __("Send WhatsApp") . '</a>';
        }
        else {
            echo __("Message sent", "woocommerce");
        }
    }
}

add_action( 'admin_init', 'dvs_redirect_whatsapp_send' );
function dvs_redirect_whatsapp_send() {
    global $pagenow;

    # Check current admin page.
    if ( $pagenow == 'edit.php' && isset($_GET['post_type']) && $_GET['post_type'] == 'shop_order'
    && isset($_GET['send']) && $_GET['send'] == 'dvs_whatsapp' && isset($_GET['order_id']) && $_GET['order_id'] > 0 ) {
        $order = wc_get_order( $_GET['order_id'] );

        $msg = sprintf( __("Hello %s %s, your order #%s has been received. The order amount is %s. Your payment method is %s. %s", "woocommerce"),
            $order->get_billing_first_name(),
            $order->get_billing_last_name(),
            $order->get_order_number(),
            $order->get_total(),
            $order->get_payment_method_title(),
            __("Please contact us if you have any question regarding your order. Thank you.", "woocommerce")
        );

        $whatsapp_num = WC()->countries->get_country_calling_code( $order->get_billing_country() ) . $order->get_billing_phone();

        update_post_meta( $_GET['order_id'], '_wapp_sent', 'true' ); // Mark order as WhatsApp message sent

        wp_redirect( 'https://wa.me/' . $whatsappnum . '?text=' . urlencode($msg) ); // Redirect to WhatsApp sending service
        exit;
    }
}

Code goes in functions.php file of your active child theme (or active theme). Tested and works.

user_37307540

I believe this should do the trick:

jQuery to insert on your page

jQuery('.dvs-whatsapp-btn').click(function(){
    jQuery('<span class="link-clicked">Link clicked!</span>').insertAfter('.dvs-whatsapp-btn');
    jQuery('.dvs-whatsapp-btn').hide();
});
user_40353920
Related