featured
Digital Success. One and Done.TM
Experience the best of everything Caspio has to offer.
Start Your Free Trial in 30 Seconds
Learn to Build Caspio Apps for FREE
Stretch the Limits of Low-Code: Mobile Apps, Messaging, Integrations & More
Stand With Ukraine
We're ranked the strongest of all vendors based on product strengths.
SiteRocket Labs Transforms Healthcare Delivery
Builds HIPAA-compliant apps and slashes development time by over 60%.
Low-Code Fuels National Energy Company
J-W Power meets demand for custom apps despite limited IT resources.
Build Your Own CRM Without Coding or IT Skills
Learn how to create a custom CRM application in a matter of hours.
Caspio Powers Over 1 Million Applications
Low-code pioneer continues to democratize application development.
Build custom applications fast, without any coding or IT skills.
Part 4 will teach you how to build a payment form in Caspio and deploy it to your website.
First, you must have an SSL certificate provided by your hosting company. This means your website needs to be an HTTPS.
In this example, you’ll learn how to build a form that allows you to book a meeting room. Other functions include subtotal and grand total calculations, and ways to process the payment (credit card or PayPal).
Once inside your Caspio account, go to the Tools dropdown on top and click Payment Processors.
If you don’t see this option in the dropdown menu, you don’t have the right plan with Payment Processors. Check our pricing page for more details.
To set things up, click New Processor on top and follow the instructions prompted on the screen. At the moment, Caspio allows you to connect to either Stripe or PayPal. You’ll need to have a Stripe or PayPal business account to have payment gateways connected to Caspio.
Once you’re done configuring one or both, click Home to go back to your homepage.
Similar to the previous videos, click the New App link on top when setting up a new application. You’ll then be given two options to begin:
Click the second option to build your application from scratch.
You’ll then be prompted to name your app — input Payment Form for this tutorial and click Finish to see your app listed on your home screen.
Next, Open the new app container to access the App Overview. You’ll find all the different objects to build apps on the left-hand panel.
Tables are the foundation or backbone of any app you develop inside Caspio. Click the Tables object to begin.
TABLE 1: Meeting_Rooms
Click the New Table link on top and list the following fields with their corresponding DataType:
Take note of the following with regards to the data types used:
Click Save on top and name your table Meeting_Rooms, then click Finish.
Note that in your table container, you can always click on Design to modify your fields or click Open to see all your data inside.
Next, go to DataPages and click the New DataPage link on top. This will launch Caspio’s point-and-click DataPage wizard to help you build your app interfaces.
DATAPAGE 1: Book a Meeting Room
Wizard Step 1 – DataPage Type
Click Next to continue.
Wizard Step 2 – DataPage Data Source
Under DataPage Properties, configure the following fields:
Wizard Step 3 – Select Fields
Wizard Step 4 – Configure Fields
You have a very simple form at this point. Make the following changes under DataPage Elements to create dropdowns, radio buttons and calculations:
Note that you can also input these fields using the insert button below the Formula panel.
Click Preview once again to view your changes and test the calculated fields.
Try selecting different options in your form and see how they affect the Total Cost.
The last thing you need to do on this wizard screen is insert credit card and PayPal options.
Follow these steps to add your payment gateways and payment processors:
Make the following changes in the Standard tab:
Note that in the Advanced tab, you can capture and store additional transaction data inside your table. However, you’ll need to create these fields inside your table first. Only then can you select them from your dropdown menus.
Click Preview to check how the final form will look like on your website.
Click Finish to save your work, then deploy your DataPage to your website (similar to how it’s done in the previous videos).
In the final video, we’ll show you how to inject some HTML and CSS into your form to make it more visually appealing.
Share this post: