- This topic has 4 replies, 2 voices, and was last updated 5 months ago by .
-
Topic
-
Hi.
I’m sure I’m doing something really daft here (my coding is a bit rusty after a couple of decades break from getting my hands dirty).
At the moment I’m simply trying to get a button on a form to have an action. I’m following this tutorial and I just get nothing happening when I click either button. https://metabox.io/add-custom-javascript-actions-using-meta-box/#more-19638
I’m using the MB Builder to create a basic form as per the tutorial which gives me:
<?php add_filter( 'rwmb_meta_boxes', 'your_prefix_register_meta_boxes' ); function your_prefix_register_meta_boxes( $meta_boxes ) { $prefix = ''; $meta_boxes[] = [ 'title' => esc_html__( 'Button Code Test', 'text-domain' ), 'id' => 'button-code-test', 'fields' => [ [ 'id' => $prefix . 'whole_sale_price', 'type' => 'text', 'name' => esc_html__( 'Wholesale Price', 'text-domain' ), ], [ 'id' => $prefix . 'retail_price', 'type' => 'text', 'name' => esc_html__( 'Retail Price', 'text-domain' ), ], [ 'id' => $prefix . 'discount_price', 'type' => 'text', 'name' => esc_html__( 'Discount Price', 'text-domain' ), ], [ 'id' => $prefix . 'button_reset', 'type' => 'button', 'name' => esc_html__( 'Reset', 'text-domain' ), 'std' => 'Reset', ], [ 'id' => $prefix . 'set_default', 'type' => 'button', 'name' => esc_html__( 'Default', 'text-domain' ), 'std' => 'Default', ], ], 'type' => 'user', ]; return $meta_boxes; }
This is the code entered into functions.php for the TwentyTwenty theme which apart from having my forms has been unaltered (no other changes to functions.php etc):
add_action( 'rwmb_enqueue_scripts', 'twentytwenty_enqueue_custom_script' ); function twentytwenty_enqueue_custom_script() { wp_enqueue_script( 'script-id', get_template_directory_uri() . '/assets/js/admin.js', array( 'jquery' ), '', true ); }
I’m then adding the following into the admin.js file as described:
jQuery( function ( $ ) { $( '#button_reset' ).on( 'click', function() { $( '#button-code-test' ).find( 'input[type=text]' ).val(''); } ); $( '#set_default' ).on( 'click', function() { $( '#button-code-test' ).find( '#whole_sale_price' ).val('150000'); $( '#button-code-test' ).find( '#retail_price' ).val('100000'); $( '#button-code-test' ).find( '#discount_price' ).val('80000'); } ); } );
The admin.js file is located here: public_html/s4pshareportal.co.uk/wp-content/themes/twentytwenty/assets/js.
The form is placed on a page using the shortcode [mb_frontend_form id=’button-code-test’] and can be seen on the page https://s4pshareportal.co.uk/
I think the only thing I’ve done different to the tutorial is to have the form show on a page rather than a post but I guess I’ve done something else wrong as neither button does anything when I try it.
Any hints would be much appreciated.
- You must be logged in to reply to this topic.