Custom WooCommerce notice message when clicked on a button

Question

Is there any way to show custom wc_add_notice() message when user clicks on a button which has an id associated to it? Some snippet code that I can use in my functions.php.

For instance, in orders section I have 'Cancel Order' button:

<a href="..." id="cancel-order" class="woocommerce-button button">Cancel Order</a>

I want to show woocommerce-info notification when user clicks on the button, like when user adds an item into cart and WooCommerce shows success notification message.

If you want to add notice straight after user click button without reloading page, I suggest use javascript ;) — Beneris
This question is too vague and should include the code that you are using to output that button… without that this question is not clear and viable. nobody can't guess what you already have… — LoicTheAztec

Beneris Beneris · Accepted Answer · 2018-07-18T15:53:29

add_action( 'wp_footer', 'extra_js_footer' );
function extra_js_footer() {
    $messages = array(
        'first_id' => '<p>message html</p>', 
        'secondid' => '<p>message html2</p>', 
    );

    $msg_json = json_encode($messages);
    echo '<script> var msgArr = '.$msg_json.';';
    echo 'jQuery.noConflict(); (function(  ) { $(function() { ';
    echo ' $.each(msgArr, function(k, v) {';
    echo '$("#"+k).on("click", function(){ alert(v)})';
    echo ' );';
    echo ' }); })(jQuery);';
    echo '</script>;
}

instead of alert should be function which appends content to document, but you can figured out you self, also if there are some errors on this (did function on the fly)

Custom WooCommerce notice message when clicked on a button

1 Answers