How to add a quantity functionality to a PayPal form

RSForm!Pro does not include, by default, a functionality that would enable you to set up a quantity field and associate it with a single product or multiple product field. However, the component's flexibility allows implementing this through custom scripting, here's what you need to do:

The RSForm!Pro Payment Package

To add any type of PayPal functionality to an RSForm!Pro form, you need to first install the RSForm!Pro Payment Package. It can be downloaded from our website:

Downloads >> My Downloads >> RSForm!Pro >> click on view all plugins and modules >> RSForm!Pro Files >> Plugins >> Payment Package (Payment Plugin + PayPal + Offline) for Joomla! 3.x.

Installing the plugin is done in the same manner as with any other Joomla! extension, through the Extensions >> Extension Manager feature.

Form field structure

To demonstrate the implementation of this type of functionality, we have created a new RSForm!Pro form containing the following fields:

• A default PayPal integration Multiple Products field, named products with the items defined as follows:



10|T-Shirt

20|Pants

30|Shoes




• Please note that, although we have named the field products, you can name it in any way you like, just remember to adjust its name in the code that will be provided below as well, otherwise this example will not work. This applies for all other fields.
• The values found to the left of the pipeline character ( | ) represent the products prices, whereas the values found to the right side (T-Shirt, Pants and Shoes) represent the products captions that will be displayed in the frontend.


• A dropdown named quantity containing items from 1 to 5, each on a separate line.


• Instead of values from 1 to 5 you can use any quantities your particular scenario requires.
• You might want to place the field to the left or right side of the multiple product field. To do so, you will need to manually adjust the forms layout.


• A default PayPal integration Choose Payment field. Please note that it is mandatory for this field to be present in any PayPal form.


• The (Payment) PayPal field, also mandatory for the form to redirect to PayPal when submitted.


• The default PayPal integration Total field - mandatory.


• A Submit Button. Make sure you don't confuse it with the regular Button, otherwise the form won't get submitted.

The custom code

The actual functionality is being provided by the code snippets below. Please add the following code in the Components >> RSForm!Pro >> Manage Forms >> edit your form >> Properties >> CSS and Javascript tab >> Javascript area:

    <script type="text/javascript">
    function totalQuantity(){
      getPrice_x();
      //calculate a grand total based on the available product field
      quantity = parseInt(document.getElementById('quantity').value);
      //retrieve the value selected in the "quantity" field
      currentTotal = parseFloat(document.getElementById('total').value);
      //adjust displayed total
      total = quantity * currentTotal;
      //re-calculate the total based on the value selected in the "quantity" field
      document.getElementById('total').value = total.toFixed(2);
      //convert the "total" field's value to a float number followed by 2 decimals
      document.getElementById('payment_total_x').innerHTML = total.toFixed(2) + ' USD';
      //display the total field's value along with the "USD" currency code
      document.getElementsByName('form[rsfp_Total]')[0].value = total.toFixed(2);

    return true;
    }

        window.onload = function() {
          totalQuantity();
        };
    </script>

Then, head to

• Components >> RSForm!Pro >> Manage Forms >> edit your form >> Components >> edit the quantity field >> Attributes tab and add the following code in the Additional Attributes field:



onchange="totalQuantity();"



• Components >> RSForm!Pro >> Manage Forms >> edit your form >> Components >> edit the products field >> Attributes tab and add the following code in the Additional Attributes field:



onchange="setTimeout(totalQuantity, 100)"