Paypal Add to Cart button creation question

Paypal - Add to cart button creation

On website's we've seen a Paypal button - created and delivered from Paypal - that allows a product purchaser to enter the number of items they wish to purchase.

This is entered into a textbox directly above the Paypal button.

As soon as a purchaser enters the quantity they wish to purchase the - Total Amount (i.e. Value of purchase) is calculated internally by the button codespec.

What Paypal seems to do is permit the button creator to embed a - single unit cost price - into the button codespec at creation time.

Then displays a textbox above the button that captures - Quantity Purchased.

The value entered into the textbox is then multiplied by the - Unit Price - embedded into the button codespec.

This value is then returned to Paypal as the amount to be paid by the purchaser.


Please take a look at the attached image, which indicates what we are trying to achieve.

This type of - Add to Cart - button can be created via Paypal's button creation webpage.

We really want to know, step by step, how to create such a button using Paypal's button creation webpage.

 Add to Cart Paypal Button
Who is Participating?
Ray PaseurConnect With a Mentor Commented:
In the code snippet you will see the HTML for the row that contains the Custom button.

See line 9.  This looks interesting but in practice it is pretty simple.  All that is going on is that PayPal receives a form field named "quantity" and does the math, unit_price x quantity = extended_price.  This is not mapped at the time of button creation; it is calculated at the checkout.  The form provides a default value of "1"

<input maxlength="2" name="quantity" size="2" type="text" value="1" /> hours</div>

<td valign="top"><strong>Custom Projects</strong><em>: </em>$150/hour</td>
<td valign="top">
<form action="" method="post">
<input name="cmd" type="hidden" value="_s-xclick" />
<input name="hosted_button_id" type="hidden" value="KYTBJ98TPMYBL" />
<div class="inputbdr">
<input maxlength="2" name="quantity" size="2" type="text" value="1" /> hours</div>
<input class="imgWithoutBorder" alt="PayPal - The safer, easier way to pay online!" name="submit" src="" type="image" /> <img src="" border="0" alt="" width="1" height="1" />&nbsp;<br />

Open in new window

Ray PaseurCommented:
Please tell us what web site you have seen this on.  Post the URL of the page that has it so we can see it in action, thanks.
bayrossAuthor Commented:
Hi Ray,

Thank you for responding.

The website URL is:

Do look at the - Custom Projects - Box.  

Apparently individuals can purchase a specific number of hours consultancy at a fixed hourly rate.  

When you reach your Paypal account to pay the  - Total Cost - for the hours are correctly displayed.

The button has been created using - Paypal's button creation system.

Somehow there is a relationship between the textbox content - i.e. No of hours, User entered - and the Button's - Hourly rate - mapped at the time of button creation in Paypal.

Any help will be appreciated.  We seem to be stuck.

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

Ray PaseurCommented:
Sorry.  See line 8, not line 9.

HTH, ~Ray
bayrossConnect With a Mentor Author Commented:
Hi Ray,

Thanks for your input.  It was very valuable for us.  We were trying to figure out how to create the Paypal button which included the textbox so that both became integral to the Paypal button code.

What I've understood from your reply is that all one needs to have in the web form is a text box whose Name is - Quantity.  

When the Paypal button is clicked, contents of the textboxes within the form are - Submitted - to Paypal.

When Paypal receives the contents of the - Quantity - text box Paypal does the Math.  Hence, if quantity is empty Paypal will understand that - One Unit - is being purchased, otherwise some very simple arithmetic is all that Paypal has to do to figure out the billable amount.

This really eluded us completely.  

Once again thank you for the trouble you taken to understand and reply to my query.  Truly appreciate this.
bayrossAuthor Commented:
We were over thinking this issue.  It took some plain and simple explanation from Ray to help understand what we should have seen in the first place.

We are very happy with the explanation and appreciate Ray's input.
Ray PaseurCommented:
This may not be completely true:

if quantity is empty Paypal will understand that - One Unit - is being purchased,

In the example we looked at, the default value for quantity is 1 (one) which is different from empty.  It would be interesting to see what PayPal would do with an empty field, or perhaps with a negative value!

Best regards, ~Ray
bayrossAuthor Commented:
Hi Ray,

Now that you've opened my mind to this, perhaps I could take out a little insurance and code a Javascript method that checks if the quantity field has been left as empty, if it is, then load the number - 1 - into it.  

If the quantity field has a negative signed number inserted by a site visitor then display an appropriate message to the site visitor and abort the Submit.

I'd have though that if Paypal, can give such button code away for free from their website, ( to make it as easy as possible for people to use the Paypal for payment ), they would have built this kind of intelligence into the Server side, code that handles the  value returned by the - Quantity - field.

BUT - I guess there is nothing like adding some fairly sensible client side data validation I guess.

Another issue that raises its head is if any site visitor has - Javascript - disabled in their Browsers, but that's not to tough to handle.

Thank you for drawing my attention this though.  I guess I was taking Paypal a bit - For Granted.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.