Adding Own amount on payment button

Question

Does anyone know how I could go about inserting a custom amount in a payment button. The vender (Payfast) does not allow just a payment link where a customer can enter their own amount, the amount has to be specified in the link.

Here is the link:

<a href=”https://www.payfast.co.za/eng/process?cmd=_paynow&receiver=support%40payfast.co.za&?item_name=Black+Eye+Boxing+Gloves&amount=129.99″>

The amount of 129.99 I want to have replaced with the amount a customer enters into a field before pressing the link. Is this possible? The only other route seems to be severe hacking of sophisticated ecommerce plugins like woocommerce + name your price... I am sure there is a simple, elegant solution...

Answer 1

By default leave the href attribute in the tag empty and give it a id

<input type='text' name='payment' onblur="add_value(this.value);">
<a id='pay_button'>Pay</a>
<script type='text/javascript'>
function add_value(value)
{
var url = 'https://www.payfast.co.za/eng/process?md=_paynow&receiver=support%40payfast.co.za&?item_name=Black+Eye+Boxing+Gloves&amount='+value;
var elem = document.getElementById('pay_button');
elem.setAttribute("href", url);
}
</script>