ASP.NET: How to Integrate Both Google Checkout and PayPal In 3 Steps

Trying to get Google Checkout and PayPal to work with a custom .NET site or solution has been a problem for as long as they’ve been around. If you don’t know what you’re doing, it can be a daunting task, and sometimes even if you do know what you’re doing! Well, I am going to take the guesswork out of this chore once and for all, as I have recently discovered the ultimate way to integrate these payment gateways into your website.

If you’re saying, “Wait a second, haven’t you already written an article on this?” you are correct. However, the solution I present to you here is infinitely simpler and requires fewer moving parts. The only reason I didn’t take the previous article down is because it does present interesting information about nesting MasterPages.

The Solution

In their documentation, PayPal and Google Checkout both mention that you must put their code into your site exactly as they have it, using the HTML forms they way they have structured them. This is not true. There are only a few bits of information that are required, and so long as they are present in an acceptable fashion, your pass-off to these gateways will work smoothly and flawlessly.

1. Get rid of your form tags. That’s right. Lose the form tags. You will only need your <form runat="server"> tag, no more nested HTML forms. W3C compliancy, here we come! However, don’t lose the information contained in your old <form> tag attributes. You’ll still need some of that.

2. Create image buttons for Google Checkout and PayPal. While they don’t have to be image buttons (for functionality’s sake), both Google and PayPal will get upset if you have standard buttons instead of their images as checkout buttons. It is in this button where the magic happens – the button has a property called PostBackURL. This is where you will put the action string from your form. For instance, PayPal’s PostBackURL value is “https://www.paypal.com/us/cgi-bin/webscr”. Google’s will be “https://checkout.google.com/cws/v2/Merchant/%5Byour merchant number]/checkoutForm”. You can put both Google’s and PayPal’s buttons next to each other. Here is some sample code:
   <asp:imagebutton id="btnSubmitPaypal" runat="server" imageurl="/images/checkout-paypal.gif" alternatetext="Purchase Using Paypal" postbackurl="https://www.paypal.com/us/cgi-bin/webscr" />

3. Create your hidden inputs to transfer information to PayPal and Google Checkout (from the same page, no extra postbacks!). However you dynamically create your hidden input tags, keep doing it. Just keep this in mind: Google Checkout and PayPal have no tags in common except one, the “item_name_x” (where “x” is a number) tag. If this is the same for both Google Checkout and PayPal, leave it alone and only have one! If you must have two (as I do), make sure you put Google’s tags before PayPal’s. This is important because Google reads the first tags that match what it’s looking for and ignores everything else. PayPal will take the last tag that matches its requirements.

   I mention this because Google Checkout has an “item_description_x” attribute that will take additional information about the item where PayPal does not, meaning that PayPal users have to cram all the info about their product into the “item_name_x” tag. Thus, if you change the order, Google will display double information (PayPal’s “item_name_x” plus their own “item_description_x” tag) and PayPal will display only what you want to transfer to Google Checkout (the last “item_name_x” tag).

4. BONUS: Hook up Google Analytics. For those advanced users who want to hook up their Google Analytics, you still can using this method. The asp:button element has an attribute called OnClientClick. Put the following as the value for this attribute in your Google Checkout image button: setUrchinInputCode();

For those looking for some sample code on how to dynamically generate your input tags, simply create a literal somewhere on the page and populate it with the following function:

Public Function CreateCheckoutTag(ByVal att As String, ByVal value As String) As String
		Dim input As String = "<input type=""hidden"" name=""" & att & """ value=""" & CleanText(value) & """ />"
		Return input
	End Function

Where the CleanText(value) function cleans any possible special characters from the value. Not necessary, but recommended.And that’s it! Three or four easy steps and you’re ready to use both Google Checkout and PayPal Website Payments on your website! I hope this saves someone 60 or 70 hours of their life, as it would have mine had I known about it three years ago 🙂

ASP.NET and AJAX: Error Making Forms Visible With UpdatePanel

While converting a site to a MasterPage-driven site, I ran across an issue involving UpdatePanels, Panels and Forms. The scenario is that in my MasterPage, I have an UpdatePanel that wraps my ContentPlaceHolder, thereby applying the AJAX functionality to all pages associated with that MasterPage. The content page in question has a panel that is invisible until a button is pressed. The contents of the panel are two non-server forms for PayPal and Google Checkout. Before I converted the site to MasterPages and AJAX, the functionality performed correctly, but afterwards, the site would hang (ie, not complete the server side action), and the browser would produce the Javascript error:

“Unknown runtime error”

I tried many different combinations of contents for the panel, but the only one that seemed to produce the error was whenever a form was present inside the panel. This was very frustrating, as no one around the internet community really seemed to have run across this error, and modifying the MasterPage to account for this single scenario would be a nightmare.

A working solution I came up with for this rare error is to wrap your content (on your .aspx page) with another UpdatePanel and set your triggers to post back when the button is pressed. While the client may have to suffer another postback, it’s not as bad as a total loss of functionality.

If you can find a more elegant solution to this problem, I would love to hear it!

EDIT (2/29/08): I believe the error occurs whenever you are using nested HTML forms within your runat=”server”. If you’re looking to post to another form, please see my article on integrating PayPal and Google Checkout.