Adding a payPal “buy now” button in Flex
I’m in the early stages of developing a paypal shopping cart system in Flex. A cursory glance on the web told me that many of you have questions about this topic. I’ve seen many questions from people using thee HTTPService class to try to do this. It seems (although I’ve only been looking at this for a very short time) that HTTPService will not redirect after a “POST”. So for those wanting to crack this open a bit, here’s a method of sending data to paypal with a redirect from a paypal button using flash.net.URL request. Although this example is very basic, and a full shopping cart app integrated with paypal is obviously alot more work, one can see that doing a simple “buy now” is pretty easy. Most of the (not working) examples I saw were making it much harder than it is. After all the HTML is just:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
<title>Untitled Document</title>
</head>
<body>
<form action=”https://www.paypal.com/cgi-bin/webscr” method=”post”>
<input type=”hidden” name=”cmd” value=”_xclick”>
<input type=”hidden” name=”business” value=”you@youremail.com”>
<input type=”hidden” name=”item_name” value=”Item Name”>
<input type=”hidden” name=”currency_code” value=”USD”>
<input type=”hidden” name=”amount” value=”0.00″>
<input type=”image” src=”http://www.paypal.com/en_US/i/btn/x-click-but01.gif” name=”submit” alt=”Make payments with PayPal - it’s fast, free and secure!”>
</form>
</body>
</html>
Here’s the Flex:
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” >
<mx:Image source=”http://www.paypal.com/en_US/i/btn/x-click-but01.gif” horizontalCenter=”0″ verticalCenter=”0″ click=”makePayment();”/>
<mx:Script>
<![CDATA[
import flash.net.URLRequest
public function makePayment():void{
var url:String = “https://www.paypal.com/cgi-bin/webscr”;
var request:URLRequest = new URLRequest(url);
var variables:URLVariables = new URLVariables();
variables.cmd=”_xclick”;
variables.currency_code=”USD”;
variables.business=”clayton@tetraktysdesign.com”;
variables.item_number = “001″;
variables.item_name = “Donation to Flex Community For This Awesome Code Sample”;
variables.amount= “2.00″;
variables.quantity = 1;
variables.tax = ”;
request.data = variables;
request.method = URLRequestMethod.POST;
navigateToURL(request,”_parent”);
}
]]>
</mx:Script>
</mx:Application>
The first things that come to mind for me are:
1) get your item data from an external xml file and an HTTPService call
2) use the repeater component to create your buttons (and product shots)
and of course, the whole shopping cart situation … I’ll be up for a while.
Hope this helps some of you.