I thought this would be really simple but have spent a few days and am stuck.
The idea is to insert a form on a page via shortcode; the form calculates totals from user input. The script and form play fine together when placed in a single HTML file. In the plugin (as you will see), the JS and FORM file are called separately. Currently, the script loads in the output, the form loads on the page that has the shortcode, but the CALC function will not work, either locally or on my server. Here are the bare-bones functions from my plugin:
/* Register and enqueue the script*/
wp_register_script( 'ndm-mini-storage-calculator', plugins_url('/ndm-mini-storage-calc/ndm-mini-storage-calculator.js', __FILE__ ) );
wp_enqueue_script( 'ndm-mini-storage-calculator' );
/* Add function to load the form and add shortcode */
function show_calc_form(){
return $options = wp_remote_retrieve_body( wp_remote_get( plugins_url() . '/ndm-mini-storage-calc/mini-storage-calculator_noscript.html' ) );
}
add_shortcode('ndm-mini-calc', 'show_calc_form');
Script and form is here: http://jsfiddle.net/p8j3T/2/
Live page is here: http://www.northwindcomputing.com/ndm-mini-storage-calc-test/
Thanks!!
Remove the plugin URL,
plugins_url
will get that for you.It's also a good idea to load files on init
If you open the console, you'll notice the url looks like
http://www.northwindcomputing.com/wp-content/plugins/ndm-mini-storage-calc/ndm-mini-storage-calc/ndm-mini-storage-calculator.js?ver=3.9
While the script is located at
http://www.northwindcomputing.com/wp-content/plugins/ndm-mini-storage-calc/ndm-mini-storage-calculator.js?ver=3.9
the plugin path is added twice.