Code Examples

The following code examples have been designed to show you how simple and quick it is to integration into our Hosted Payment Page service. The examples use Javascript and are designed for testing purposes only.

We do not support any changes that you make to these examples and would recommend that your web developer uses server side scripting or a shopping cart.

Simple Buy Now Button

To help you get started trading online Today our Purchase Token Generator provides you a simple 'Buy Now' button that you can place onto your site under the products that you wish to sell. There is no special coding or shopping cart requirements. For further details, please refer to Purchase Token Generator

multiple Buy Now Buttons

This example uses multiple Buy Now buttons to submit a single form and payment request to the Hosted Payment Page.

Product 1 - Price: £5.00   

Product 2 - Price: £10.00 

Product 3 - Price: £15.00 

<form action="https://secure.cashflows.com/gateway/standard" name="BuyForm" method="POST">
<input type="hidden" name="store_id" value="Your Profile Id">
<input type="hidden" name="cart_id" value="multiple Buy Now Buttons">
<input type="hidden" name="amount" value="0">
<input type="hidden" name="currency" value="GBP">
<input type="hidden" name="test" value="1">
<input type="hidden" name="description" value="">
<script language="JavaScript">
function calc(productNo)
{
if (productNo==1)
{
document.BuyForm.amount.value = 5.00;
document.BuyForm.description.value = "Product 1";
}
else if (productNo==2)
{
document.BuyForm.amount.value = 10.00;
document.BuyForm.description.value = "Product 2";
}
<!-- To add a new product price, copy from here... -->
else if (productNo==3)
{
document.BuyForm.amount.value = 15.00;
document.BuyForm.description.value = "Product 3";
}
<!-- ...to here, and paste directly below. You will need to alter the 'productNo' and its price value. -->
}
</script>
<p>Product 1 - Price: £5.00 <input src="http://www.cashflows.com/support/images/buy-now.png" alt="Buy button" onClick="calc(1)" type="image" /></p>
<p>Product 2 - Price: £10.00 <input src="http://www.cashflows.com/support/images/buy-now.png" alt="Buy button" onClick="calc(2)" type="image" /></p>
<!-- To add a new product, copy from here... -->
<p>Product 3 - Price: £15.00 <input src="http://www.cashflows.com/support/images/buy-now.png" alt="Buy button" onClick="calc(3)" type="image" /></p>
<!-- ...to here, and paste directly below. You will need to alter three things: the product number, price, and calc(put product number here) -->
</form>

Total Quantity Example

This example totals the quantity and price of the order and sends a single payment request to the Hosted Payment Page.

Product 1 - Price: £5.00 - Quantity   

Product 2 - Price: £10.00 - Quantity 

Product 3 - Price: £15.00 - Quantity 

Total: £

<form action="https://secure.cashflows.com/gateway/standard" name="BuyForm2" method="POST">
<input type="hidden" name="store_id" value="Your Profile ID">
<input type="hidden" name="cart_id" value="Total Quantity Example">
<input type="hidden" name="currency" value="GBP">
<input type="hidden" name="test" value="1">
<input type="hidden" name="description" value="">
<script language="JavaScript">
<!-- This function rounds numbers to numerical formatting. It does not need to be altered when adding or removing products. -->
function roundOff(value)
{
if (value == 0)
{
return "0";
exit;
}
precision = 2;
value = "" + value //convert value to string
precision = parseInt(precision);
var whole = "" + Math.round(value * Math.pow(10, precision));
var decPoint = whole.length - precision;
if(decPoint != 0)
{
result = whole.substring(0, decPoint);
result += ".";
result += whole.substring(decPoint, whole.length);
}
else
{
result = whole;
}
return result;
}
<!-- This function checks for empty quantities. It does not need to be altered when adding or removing products. --> function CheckNull(value)
{
if (value == "")
{
value = "0";
}
return value;
}
<!-- This function is used to calculate the cost of the whole order. Product prices need to be added here, but edit further down the page to add the actual product aswell. -->
function calculate()
{
<!-- Add new product prices in here. Copy one of the three lines below and change the cost'NUMBER' and the price at the end. -->
document.BuyForm2.cost1.value = 5.00;
document.BuyForm2.cost2.value = 10.00;
document.BuyForm2.cost3.value = 15.00;
basicprice = roundOff(Number(CheckNull(document.BuyForm2.qty1.value) * document.BuyForm2.cost1.value)
+ Number(CheckNull(document.BuyForm2.qty2.value) * document.BuyForm2.cost2.value)
<!-- When adding a new product you need to copy from here... -->
+ Number(CheckNull(document.BuyForm2.qty3.value) * document.BuyForm2.cost3.value)
<!-- ...to here, and paste directly below. Changing both the quantity and cost numbers to the new product. -->
);
<!-- To add a new product description copy this: '+ (document.BuyForm2.qty2.value) + " x Product 2, "' , and place it at the end of this line before the ';'. You will need to edit the qty'NUMBER' and the Product 'NUMBER'. -->
document.BuyForm2.description.value = (document.BuyForm2.qty1.value) + " x Product 1, " + (document.BuyForm2.qty2.value) + " x Product 2, " + (document.BuyForm2.qty3.value) + " x Product 3.";
document.BuyForm2.amount.value = roundOff(Number(basicprice));
}
</script>
<p>Product 1 - Price: £5.00 - Quantity <input name="cost1" value="" type="hidden"/><input name="qty1" size="3" value="0" /></p>
<p>Product 2 - Price: £10.00 - Quantity <input name="cost2" value="" type="hidden" /><input name="qty2" size="3" value="0" /></p>
<!-- To add a new product, copy from here... -->
<p>Product 3 - Price: £15.00 - Quantity <input name="cost3" value="" type="hidden" /><input name="qty3" size="3" value="0" /></p>
<!-- ...to here, and paste directly below. You will need to alter three things: the product number, price, and calc(put product number here) -->
<!-- This line generates a button that calculates the cost of the whole order. It does not need to be altered when adding or removing products. -->
<p><input name="calcButton" onClick="calculate()" value="Calculate Total" type="button"> Total: £<input name="amount" size="3" value="0" /> <input value="Reset" name="RESET" type="reset" /><p>
<p align="center"><input value="Submit" name="SUBMIT" type="image" src="http://www.cashflows.com/support/images/buy-now.png" /></p>
</form>

Total Quantity and Postage Example

This example totals the price of the order, adds a postage charge then sends a single payment request to the Hosted Payment Page.

Product 1 - Price: £5.00 - Quantity   

Product 2 - Price: £10.00 - Quantity 

Postage & Packaging:

UK (£2.75) Europe(£4.75) USA (£5.75) Asia (£5.75) Rest of World (£8.75)

Total: £

<form action="https://secure.cashflows.com/gateway/standard" name="BuyForm3" method="POST">
<input type="hidden" name="store_id" value="Your Profile Id">
<input type="hidden" name="cart_id" value="Total Quantity and Postage Example">
<input type="hidden" name="currency" value="GBP">
<input type="hidden" name="test" value="1">
<input type="hidden" name="description" value="">
<script language="JavaScript">
<!-- The next two functions round numbers to numerical formatting. They do not need to be altered when adding or removing products. -->
function roundOff(value, precision)
{
return places(value,1,precision);
}
function places(X, M, N)
{
var T, S=new String(Math.round(X*Number("1e"+N)))
while (S.length var y = S.substr(0, T=(S.length-N));
if(N>0)
{
y += '.' + S.substr(T, N);
}
return y;
}
<!-- This function checks for empty quantities. It does not need to be altered when adding or removing products. -->
function CheckNull(value)
{
if (value == "")
{
value = "0";
}
return value;
}
<!-- This function defines the postage and packaging location. It does not need to be altered when adding or removing products. -->
function typeOfCarriage(x,whereabouts)
{
x.carriage_amount.value = whereabouts;
}
<!-- This function addeds the postage and packaging to the total price of the products. Add new postage rates here, and also edit further down the page to add them to the table. -->
function calculate(x)
{
basicprice = calc(x);
if(Number(basicprice) > 0)
{
switch (x.carriage_amount.value)
{
case "uk" :
x.postage_and_packaging.value = 2.75;
break
case "europe" :
x.postage_and_packaging.value = 4.75;
break
case "usa" :
x.postage_and_packaging.value = 5.75;
break
<!-- To add a new postage rate. Copy from here... -->
case "asia" :
x.postage_and_packaging.value = 5.75;
break
<!-- ...to here, and paste directly below. Change the case country, and the postage price. You will also need to add the postage option you have created further down the page. -->
default :
x.postage_and_packaging.value = 8.75;
break;
}
x.amount.value = Number(basicprice) + Number(x.postage_and_packaging.value);
}
else
{
x.amount.value = "0";
}
x.amount.value = roundOff(x.amount.value,2);
}
<!-- The standard price, exluding postage and packaging is calculated here. It does not need to be altered when adding or removing products. -->
function calc(x)
{
x.amount.value = 0;
var y = x.price.length;
var z = x.qty.length;
var a = Number(x.amount.value);
var b,c;
while(y > 0)
{
b = Number(CheckNull(x.price[y-1].value));
c = Number(CheckNull(x.qty[y-1].value));
a += (b * c);
y--;
}
return a;
}
</script>
<p>Product 1 - Price: £5.00 - Quantity <input name="price" value="5.00" type="hidden" /><input name="qty" size="3" value="0" /></p>
<p>Product 2 - Price: £10.00 - Quantity <input name="price" value="10.00" type="hidden" /><input name="qty" size="3" value="0" /></p>
<input name="carriage_amount" value="uk" type="hidden">
<h3>Postage & Packaging:</h3>
<p><input checked="checked" name="postage_and_packaging" onClick="typeOfCarriage(this.form,'uk');calculate(this.form)" value="" type="radio" />UK (£2.75)  <input name="postage_and_packaging" onClick="typeOfCarriage(this.form,'europe');calculate(this.form)" value="" type="radio" />Europe(£4.75) <input name="postage_and_packaging" onClick="typeOfCarriage(this.form,'usa');calculate(this.form)" value="" type="radio" />USA (£5.75) 
<!-- To add a new postage rate copy from here... -->
<input name="postage_and_packaging" onClick="typeOfCarriage(this.form,'asia');calculate(this.form)" value="" type="radio" />Asia (£5.75) 
<!-- ...to here, pasting directly below. Change the typeOfCarridge(country), and the price. -->
<input name="postage_and_packaging" onClick="typeOfCarriage(this.form,'world');calculate(this.form)" value="" type="radio" />Rest of World (£8.75)</p>
<!-- This line generates a button that calculates the cost of the whole order. It does not need to be altered when adding or removing products. -->
<p><input name="calcButton" onClick="calculate(this.form)" value="Calculate Total" type="button"> Total: £ <input name="amount" size="4" value="0"></p>
<!-- This generates a button that submits the information and send the user to payment pages. -->
<p align="center"><input value="Checkout" onClick="calculate(this.form)" type="image" src="http://www.cashflows.com/support/images/buy-now.png" /></p>
</form>