Donation Form
Place this free donation form on the website of your nonprofit or charity organization, or in case you need to accept donations. It will streamline the process of getting donations. A donor can choose a donation amount or enter a custom one. PayPal payment gateway is integrated into the form. The donor will see the payment buttons after submitting the form. The form is fully responsive and can be used on any device.
Structure and logic of the form
-
The form content is organized with Grid containers. Use grids in a form design to simplify layout, ensure consistency, and enhance the user experience.
-
Custom buttons represent donation amounts. The highlightSelectedAmount() function highlights a button with the corresponding amount.
-
An HTML control is added with the PayPal buttons code snippet.
JavaScript
-
Click handlers of the donation buttons populate the DonationAmount field.
-
The highlightSelectedAmount() function is called each time the DonationAmount field changes and on the form load, and highlights the selected amount.
-
The function within the saved() event hides the form and shows PayPal buttons. The variable donationAmount holds the value of the DonationAmount field.