Create a payment page wher customer pays first before submitting the form

I would like to create a payment page where the customer pays first before submitting the info form

Two questions 

1. how do I do that 

2. how do I do that where they pay and once payment is submitted they are directed back to submit the actual information form

Please note that it is not possible to capture payment without clicking the Submit button first. For payment forms, the internal process goes below:

1. Once user clicks the submit button, the payment details are sent to the payment processor

2. Payment processor then checks for the validity of such payment

3. If payment was unsuccessful, an error is shown to the user

4. If payment was successfully processed by payment processor, the form data is then processed as a "form submission"

Given that, it actually already suffice your requirements though user still needs to click the Submit button.

Setting-Up-Your-First-Order-Form