Stripe

<div class="quform-label">
    <label class="quform-label-text" for="card-element">Credit or debit card<span class="quform-required">*</span></label>
</div>
<div id="card-element" style="padding:10px 0;"></div>
<div id="card-errors" role="alert" style="color:#c73412;"></div>
<input type="hidden" id="stripeToken" name="stripeToken">

jQuery(function ($) {
    var stripe = Stripe('pk_test_key');
    var elements = stripe.elements();
    var style = {
        base: {
            color: '#32325d',
            fontFamily: '"Helvetica Neue", Helvetica, sans-serif',
            fontSmoothing: 'antialiased',
            fontSize: '16px',
            '::placeholder': {
                color: '#aab7c4'
            }
        },
        invalid: {
            color: '#fa755a',
            iconColor: '#fa755a'
        }
    };

    var card = elements.create('card', { style: style });
    card.mount('#card-element');

    // Handle real-time validation errors from the card Element.
    card.addEventListener('change', function(event) {
        var displayError = document.getElementById('card-errors');
        if (event.error) {
            displayError.textContent = event.error.message;
        } else {
            displayError.textContent = '';
        }
    });

    var $form = $('#card-element').closest('.quform-form');

    $form.off('submit').on('submit', function (event) {
        event.preventDefault();

        stripe.createToken(card).then(function (result) {
            if (result.error) {
                // Inform the user if there was an error.
                var errorElement = document.getElementById('card-errors');
                errorElement.textContent = result.error.message;
            } else {
                $form.find('#stripeToken').val(result.token.id);
                $form.data('quform').submit();
            }
        });
    });
});

<?php

/*
 * Plugin Name: Quform Stripe
 * Description: Stripe integration for Quform.
 * Version: 1.0.0
 */

add_filter('quform_post_validate_1', function (array $result, Quform_Form $form) {
    require_once 'vendor/autoload.php';

    \Stripe\Stripe::setApiKey('sk_test_key');

    try {
        \Stripe\Charge::create([
            'currency' => 'usd',
            'amount' => 2000,
            'description' => 'Example product',
            'source' => $_POST['stripeToken']
        ]);
    } catch (Exception $e) {
        $result = array(
            'type' => 'error',
            'error' => array(
                'enabled' => true,
                'title' => '',
                'content' => $e->getMessage()
            )
        );
    }

    return $result;
}, 10, 2);

add_filter('quform_post_set_form_values_1', function (array $result, Quform_Form $form) {
    if (!isset($_POST['stripeToken']) || ! Quform::isNonEmptyString($_POST['stripeToken'])) {
        $result = array(
            'type' => 'error',
            'error' => array(
                'enabled' => true,
                'title' => '',
                'content' => 'Please enter your card details to continue'
            )
        );

        // No JS response
        $form->setConfig(array(
            'errorEnabled' => true,
            'errorTitle' => '',
            'errorContent' => 'Please enable JavaScript and enter your card details to continue'
        ));
    }

    return $result;
}, 10, 2);

add_action('wp_enqueue_scripts', function () {
    wp_enqueue_script('stripe', 'https://js.stripe.com/v3/', array(), false, true);
});