Manfredk
Please Login or Register

Knowledgebase

Using a PayPal Plugin to turn your FORM into a Shopping Cart (form action to your Paypal Account)

Configuring the Paypal Plugin
(A very basic LIVE EXAMPLE is here- the Submit Button there will go to my Own Paypal Account ) The Form can be styled with CSS , and can have as many Fields, Drop down boxes with Items for sale - in this Case Excursions/Tours - as you wish)

Joomla! Paypal - Configuring the Joomla! Plugin
After installing and enabling the plugin, go to Administrator » RSForm!Pro » Configuration.

You will notice that a new tab named Paypal appeared. That's where you must set up the plugin as follows:

Paypal E-mail account: This is the account where the money will be sent.
Return URL: After the payment is complete, the user will be redirected to this configured URL. Example: http://site.com
Cancel URL: If the user cancels the payment from within the PayPal payment page, he will redirected to this URL.
Tax Type: Percent (%) / Fixed Rate
Tax value: Amount that will be added to the overall purchase price. This will be calculated as percentage or a fixed rate depending on the Tax Type selection.
Live mode: Set this option to "No" in order to test the plugin with a dummy transaction. You must have a Paypal Sandbox account.
Currency: Type here the currency which the plugin will use to operate the form. Use values such as EUR, USD, AUD, GBP etc.
Thousands Separator: This is where you set the number formatting (thousands separator(if any)).
Decimal Separator: You can set it to "." or ",".
Number of decimals: How many decimals do your prices have.

Using the Paypal form components

Once you have enabled the plugin, go to RSForm!Pro » Manage Forms and edit the form where you want to use the Paypal functionality. You will notice on the left side of the screen, just under the common form components, the new Paypal plugin form components.

There are two usage scenarios. You can use the Single product or the Multiple Products options, but never both field types on the same form. The Single product can be used for fixed donations, attachment emailing and all sorts of scenarios.

The Multiple product field type can be added for as many times you like, transforming your form into a small shopping cart. By adding the "Total" paypal field type, it will automatically calculate the total of your selected items. The multiple product items can be set as follows:
Select
price1|Description1
price2|Description2
price3|Description3

Select: this can be used as an anthet for your product dropdown. It does not have any value, just for aestethics.
price1: actual price of the product. No currency simbols are needed (the currency is picked from the plugin configuration area), just a numerical value.
Description1: can be used a product name or label (optional, without "|Description1"). This will actually be concatenated upon displaying it in the frontend.
A view option has also been added: Dropdown and Chekbox group.

The plugin will redirect the customer to the Paypal Pay page. At this time, the transaction status is set to "Pending". Once Paypal sends a notification to your script, the status will automatically change to "Accepted". If no notification is sent within 12 hours, the submission status is changed to "Denied".

Examples and screenshots
Example of using the form with a Single Product field:
3 ways to create a small Joomla! shopping cart with RSForm!Pro and PayPal
Example of using the form with the Multiple Products field:
3 ways to create a small Joomla! shopping cart with RSForm!Pro and PayPal - Part 2
Custom PayPal example: automatically calculate the total amount of the selected products and their quantities and passe it further to the PayPal page.
3 ways to create a small Joomla! shopping cart with RSForm!Pro and PayPal - Part 3

Part 1

Enough talking...briefly, this article will explain how can you turn your Joomla! site into a small shopping cart, when to use the RSForm!Pro PayPal Plugin and when to use the custom script so you can decide yourself which one suites best for your project.

This article is part 1 of a 3 part series:

in the first part, we will talk about the RSForm!Pro PayPal Plugin with the Single Products field
the second article will have information and screenshots about the RSForm!Pro PayPal Plugin with the Multiple Products field and the video tutorial How to add PayPal functionality to your Joomla! forms using the RSForm!Pro PayPal Plugin
the last article will explain the custom script available on the forum with some examples.

Before we start, let's first answer a basic question:
When to use the RSForm!Pro PayPal Plugin and when to use the custom script?

The RSForm!Pro PayPal plugin allows you to add to your forms PayPal fields for selling products trough the payment processor. It can be used successfully for selling one or multiple products with a fixed amount.

The custom script extends the form flexibility and can be adapted for different kinds of scenarios, e.g. when you want to specify the products quantity, for products that don't have a fixed amount (calculated value) or donations.

1. The RSForm!Pro PayPal Plugin:

The RSForm!Pro PayPal plugin allows you to add PayPal functionality to your Joomla! forms, it integrates with any form created with RSForm!Pro, doesn't require a special setup in the PayPal account and can be downloaded free (requires an active license of RSForm!Pro) from View my downloads -> RSForm!Pro files > Plugins .

Installation: The plugin installs like any other Joomla! plugin/module/component by uploading the file in the backend administrator panel. (Head to Extensions -> Install/Uninstall -> Upload Package File).

Configuration: After downloading and installing the plugin, you must configure it from Components-> RSForm!Pro -> Configuration so it can work with PayPal.

RSForm!Pro PayPal plugin Configuration

You will see a new tab called PayPal, near the Settings tab.
Here you can set the seller's PayPal account, the Live Mode (set it to "No" when you want to test the plugin with PayPal Sandbox and to "Yes" when you want to enable your PayPal transactions), the Currency which usually is EUR or USD, but you can find other PayPal currency codes on the developer's page, the Return Url - the page where the user is redirected after making a payment, the Thousands and the Decimal Separator.

How to add PayPal functionality

After Configuration, in the backend panel head to Components -> RSForm!Pro -> Manage Forms and select the form for which you want to add PayPal functionality.

In the bottom of the page you will see 3 new PayPal fields (besides the usual components like Textbox, Textarea, Dropdown or Checkbox): Single Product, Multiple Products and Total.

We will treat each field separately, so you can better understand how to use them.



A Total field that calculates the total amount must be added at the end of the form, whether you will be using the Single Product or the Multiple Products field.
The Multiple Products can be used multiple times, but the Single Product and the Multiple Products fields can not be used simultaneously.

1.1 The RSForm!Pro PayPal Plugin with a Single Product field

The Single Product field is used for selling one product, fixed donations or attachments.

Let's see an example of using the plugin with a Single Product field and a Total field:
A non-profit organization site wants to collect donations trough their Joomla! form, with a pre-established amount of USD 10. To achieve this, we will add a Single Product PayPal field and a Total field to the form created with RSForm!Pro.

Backend Preview:


This is how the form looks in the backend after adding the above PayPal fields:

Frontend Preview:


And this is how the form looks in the frontend after adding the Single Product field. Notice that this field isn't displayed in the frontend because we have selected "not to show in frontend" option.





A PayPal button won't be necessary anymore, because the Submit Button will handle its function. After clicking the Submit Button, the user will be redirected to the PayPal Page.

The transaction page:

The transaction page lists the product's information: its description, price, quantity and the total amount that will be withdrawn from the user's PayPal account.




Verify the payment status:

To verify the payment status in the backend Joomla! panel, head to Components -> RSForm!Pro -> Manage Submissions. The status will be automatically changed to Accepted after PayPal sends a notification to your script. If the payment is refused, the status changes after 12 hours into Denied.

PART 2

If in the first part of the article we were explaining when to use the Paypal plugin, the custom script available in the forum and the differences between the Single Product and the Multiple Product fields , the second part of this series explains the use of the RSForm!Pro PayPal Plugin with the Multiple Products field.

The RSForm!Pro PayPal Plugin

RSForm!Pro - Joomla! form manager

If you want to find out more about the use of the Single Product field with the Paypal plugin, please refer to the first part of the article.
1.2 The RSForm!Pro PayPal Plugin with Multiple Products fields

The Multiple Products field gives you more flexibility than the Single Product field. When you use this field multiple times, you can turn your form into a small shopping cart.
We will explain the Multiple Products field within 2 examples:

the first example explains in a video tutorial, the use of a Multiple Products field with a dropdown product list:
How to add Paypal functionality to your Joomla! forms using the RSForm!Pro Paypal Plugin.
the second example uses the Multiple Products field 2 times: once with a checkbox group and once with a dropdown list and a Total field that will automatically calculate the total amount.

First of all, lets talk about the video tutorial.

We have created, as an example, a small shopping cart that will be selling 3 products:

Women Boots - $19 ,
Bags -$10
Jewelry - $13 worth each.


The products are listed using the Multiple Products field with a Dropdown View.


And now, let's see an example of using 2 Multiple Products simultaneously:

In the following example, the form has 2 products available for purchase:

one product is listed with a Multiple Products field with a checkbox view
one product with a Multiple Products field with a dropdown view.

custom Joomla! form with 2 PayPal multiple products fields



When you add products using the Multiple Products field, in the Items box specify the product price, followed by the "|" character and product description.



The correct syntax is:
Product Price|Product description
You don't have to add the currency after specifying the price because it's already configured in the Configuration tab (see the first part of the article for more details.)

The Total field:

Custom PayPal form for Joomla! created with RSForm!Pro - total fields

alt

Always use a Total field at the end of the form. Its function is to calculate the total amount based on the user selection and transfer it further to PayPal.

Backend preview:

This is the backend screenshot of the form created above with 3 PayPal fields: 2 Multiple Products field and a Total field.


Frontend preview:

And this is how the form looks like in the frontend.

Notice that the total field automatically calculates and updates the amount based on user selection.



The transaction page:

After submission, the user is redirected to the PayPal page to complete the transaction. The value of the Total field is transferred further to the redirected page and it will be withdrawn from the user's account.
The Paypal Transaction Page

Verify the payment status:


The payment status can be verified in the Manage submissions tab (in the backend panel head to Components->RSForm!Pro->Manage Submissions).


If a PayPal notification is sent to the form script within 12 hours, the status automatically changes to Accepted, otherwise the status changes to Denied.
Meantime, the status is set to Pending.

Personalized emails

Finally, if you would like to send to users personalized emails containing the transaction details, you just need to fill in the User and Admin email tabs.

PART 3  Custom script

You can use custom scripts with your RSForm!Pro forms to extend the component functionality: you can specify product quantity, automatically calculate the total amount, auto fill the form fields, add a shipping cost and handling fee, etc.


Specifying products quantity:

We will modify the custom script available on the forum to automatically calculate the total amount of the selected products and passe it further to the PayPal page.

The form includes 3 products with different prices. For each product, the customer can select the desired quantity from a drop-down box. The form can be easily extended to a higher number of products. (when you add more products don't forget to change the Form Layout).

e.g. Product 1 - Price $100.00: Quantity [0] [1] [2] [3] [. . . .] [10]
Product 2 - Price $200.00: Quantity [0] [1] [2] [3] [. . . .] [10]
Product 3 - Price $90.00: Quantity [0] [1] [2] [3] [. . . .] [10]

To further demonstrate the capabilities of RSForm!Pro, we have added a Javascript function that will enable the quantity field when a product is checked. All scripts and functions will be described in detail further below.

Frontend preview:



The Total field will automatically calculate the amount based on the user's selection:

($100 x 3)+($90 x 5)=$750

After submission, the customer will be redirected to the PayPal page.

Backend preview:





Steps to create the above Paypal form:
1. Add products, prices and quantities.

We have created 3 Checkbox Groups to add the products along with their prices, and 3 Dropdown Components for specifying the quantity




The Additional Attributes area incorporates the following code snippets: onclick="enableQuantity('Product10','QunatityProd1');" and onchange="calculateTotal();"

Explanations:

  • The format of the Items area (100|Product 1 - Price $100) is designed to separate the value from the label, thus the Product 1 - Price $100 will be displayed in the front-end, but if selected, the price (100) will be stored.
  • onclick="enableQuantity('Product10','QuantityProd1');" : onclick is the javascript trigger type. Basically this implies that every time you click on the checkbox the enableQuantity function will run. Product10 and QuantityProd1 are both parameter values. We used this method (of passing parameters to the function) so we do not have to add a Javascript function for each checkbox group or perform unnecessary calculations. Though the checkbox group is named Product, you can see that we actually use Product10 (notice the extra 0). This is because the first checkbox element has a 0 appended. If we would have used a second one, it would have been Product11 and so on. QuantityProd1 is the name of the quantity drop-down that will be associated with the product checkbox.
  • onchange="calculateTotal();": as onclick, onchange is also a Javascript trigger. Whenever the selected value of the drop-down element changes, the function in question will be triggered (in this case calculateTotal()).


2. Modify form layout.

After all the fields have been added, you will have to go to the Form Layout tab, and uncheck the Auto-generate layout checkbox. This will allow you to edit the actual form layout. It is to be noted that if you add a field after this has been unchecked the layout code will not be automatically updated.

At the beginning of the already existing code you will have to add the following Javascripts (along with the Javascript tags):

function enableQuantity(prod,quantity)
{
if(document.getElementById(prod).checked)
document.getElementById(quantity).disabled = false;

else
document.getElementById(quantity).disabled = true;
calculateTotal();      
}

function calculateTotal()
{
var products = new Array("Product10","Product20","Product30");
var i=0;
var total = 0;
for(i;iif(document.getElementById(products[i]).checked)
total  = total + parseInt(document.getElementById(products[i]).value) * parseInt(document.getElementById('QuantityProd'+(i+1)).value);

document.getElementById('Total').value = total;
}

The enableQuantity function will enable the quantity drop-down if you have checked a product checkbox. This has been added so you can't select a quantity if you don't have selected a product first.

The calculateTotal function does what the name states - it calculates the total for the selected products and quantity. In terms of functionality, it verifies what products have been checked, gets the quantity and updates the value of the total field.

At the end of the code, add the following Javascript to trigger the enableQuantity function. This will ensure that although the form validation might provide an error, the quantity of the checked products will remain enabled:

enableQuantity('Product10','QuantityProd1');
enableQuantity('Product20','QuantityProd2');
enableQuantity('Product30','QuantityProd3');

3.Add additional attributes to checkbox and drop-downs

After modifying the form layout, go back to the Components tab and add the following Additional Attributes:

In the Checkbox Groups add :

onclick="enableQuantity('Product10','QuantityProd1');"

In the Drop-down components add:

onchange="calculateTotal();"

4. Add the custom script in the Scripts tab

Now, that all the calculation and aesthetics part is over it is time to move on to the actual PayPal part. In order to redirect to PayPal after the form is submitted you will have to place the following script in the Scripts called after form process area:

if($_POST['form']['Total'] != '0')
{
$business = 'me@mybusiness.com';
$item_name = 'Products';
$currency_code = 'USD';
$amount = $_POST['form']['Total'];
$return = 'http://your_site.com';
header('Location: https://www.paypal.com/cgi-bin/webscr?cmd=_xclick&business='.$business.'&item_name='.$item_name.'¤cy_code='.$currency_code.'&amount='.$amount.'&return='.$return); exit();
}




The custom script must be added in the "Script called after form has been processed ".
(Components -> RSForm!Pro -> Manage forms -> Select the PayPal form -> Scripts -> Script called after form has been processed ).

You will find a detailed explanation of the "Script called after form has been processed" section in the article Custom PHP code from documentation.

Explanations:

 

if($_POST['form']['Total'] != '0') : This basically verifies if the value of the total field is not "0". If it is 0 then there is no point to redirect to PayPal to complete the payment, and the form will carry out its normal routine. If it is different from "0" then set the PayPal parameters and redirect to PayPal.

$business='me@mybusiness.com' - replace me@mybusiness.com email with your PayPal seller account


$item_name='Products' - the product name that you intend to sell trough PayPal

$currency_code='USD' - you can change this value according to the PayPal currency codes

$amount=$_POST['form']['Total'] - grabs the calculated total value. This value will be passed to PayPal.

$return='http://your_site.com' - replace http://your_site.com with the website address where you want to redirect the customers after purchasing.



The parameters that we used are for demo purpose only. You should use the details from your PayPal account. Additional parameters can be used in the same manner. Further details on these can be seen on the PayPal documentation page.

If you want an alternative to custom scripting, you can use the RSForm!Pro PayPal plugin that we have discussed in the first 2 parts of this article: PayPal form with a Single Product field and PayPal form with Multiple Products fields, although it won't be as much as flexible as the custom script is.

If you have further questions about this script or about integrating RSForm!Pro with PayPal, you can ask our support department or simply, leave them in comments.



PART 4
We're going to extend the custom script used in the 3rd part of the article, to record through a hidden field, the payment status: confirmed or not.

Once the user submits the form and completes the transaction, the RSForm!Pro status field value will be updated as "confirmed". By default, this field is "not confirmed".

Backend preview:



You can later check the payment status by accessing the backend Joomla! panel >>Components >> RSForm!Pro >> Manage Submissions.



The 4th part of the article comes with a new form field (hidden field), that allows us to trigger the payment status. That involves several script changes.

Basically, the steps of creating the PayPal form are as described in the 3rd article.
In this article, we will only show the changes made to the above mentioned script to receive the payment confirmation.

Step 1: Add products, prices and quantities

In addition to the form components described in the previous article (textboxes for the First Name, Last Name, Email Address and Total, checkbox groups for products, dropdown for the quantity), you will need to create a hidden field , used to record the payment status: confirmed or not.

Step 2. Modify form layout

Once you have created the hidden field, head to the RSForm!Pro "Form layout" tab and add, at the end of the HTML code, the corresponding placeholder: {status:body}

Step 3: check the 3rd part of the article

Step 4:

When submitting the form, just before redirecting to PayPal, we need to pass the URL that will receive the confirmation. This will be the direct URL for the form. The new script is as follows:

if($_POST['form']['Total'] != '0')
{
$business = 'me@mybusiness.com';
$item_name = 'Products';
$currency_code = 'USD';
$amount = $_POST['form']['Total'];
$return = JURI::root();
$db = JFactory::getDBO();
$notify = urlencode(JURI::root().'index.php?option=com_rsform&formId='.$db->getEscaped($_POST['form']['formId']).'&submission='.$SubmissionId);
$url = 'https://www.sandbox.paypal.com/cgi-bin/webscr?cmd=_xclick&business='.$business.'&item_name='.$item_name.'¤cy_code='.$currency_code.'&amount='.$amount.'&return='.$return.'¬ify_url='.$notify;
header('Location: '.$url);
exit();
}


Explanations

The new addition is the use of the PayPal notify URL parameter: ¬ify_url . This will simply point back to the form with a parameter that will uniquely identify the submission that is being processed.
Notice the $SubmissionId variable.

Up next, we need to process the confirmation and update the status field. We can easily do this by using the following script, placed in the "Scripts called on form display" area, "Manage forms" tab :

$db = JFactory::getDBO();
$sid = $db->getEscaped(JRequest::getVar('submission'));
if(!empty($sid))
{
$db->setQuery("UPDATE #__rsform_submission_values SET `FieldValue` = 'confirmed' WHERE `SubmissionId` = '".$sid."' AND `FieldName` = 'status'");
$db->query();
die();
}


Explanations

Based on the earlier mentioned $SubmissionId variable, we can identify the submission that is being confirmed and update the value of the status field. Note that the script will be executed only if the submission confirmation is received.

(A very basic LIVE EXAMPLE is here- the Submit Button there will go to my Own Paypal Account ) The Form can be styled with CSS , and can have as many Fields, Drop down boxes with Items for sale - in this Case Excursions/Tours - as you wish)



Was this answer helpful?

Add to Favourites Add to Favourites

Print this Article Print this Article

Also Read

Language:

Quick Navigation

Client Login

Email

Password

Remember Me

Search