I built a order form using WordPress Contact Form 7 plugin. I’m wanting to update the price automatically when quantity field’d value is changing on mouse click or key press.
See the animated image file. You can understand the requirement.
I added the simple JS code into my js file.
Assume your quantity field name is number-323 & price field name is number-450 . So JavaScript code will be like this:
1 2 3 4 5 6 7 8 9 |
jQuery(document).ready(function() { jQuery("input[name='number-323']").on('keyup mouseup', function() { var qty = jQuery("input[name='number-323']").val(), price = jQuery("input[name='number-450']").attr('placeholder'), newprice = price * parseInt( qty ); jQuery("input[name='number-450']").val( newprice.toFixed(2) ); }); }); |
You will setup the initial price value as a placeholder attribute. In this demo initial price value is 109.90.
Leave a Reply