Question

90

stripe checkout custom button not charging

rated 0 times [ 94] [ 4] / answers: 1 / hits: 10402 / 10 Years ago, thu, march 20, 2014, 12:00:00

I am trying to get Stripe's Checkout Custom Button to charge a credit card but all it does is minimize after I enter the credit card details. I am using the code found in the documentation but I can't get it to work. The simple button is easy to use and I figured it would be as easy as just customizing that one but it's very different.

Here's the code:

Payment Page

<form action=charge.php method=post>

            <script src=https://checkout.stripe.com/checkout.js></script>

            <input type=submit value=Pay with card id=customButton/>

            <?php require_once('./config.php'); ?>

                <script>

                var handler = StripeCheckout.configure({

                    key: '<?php echo $stripe['publishable_key']; ?>',

                    image: 'favicon.png',

                    token: function(token, args) {

                    // Use the token to create the charge with a server-side script.

                    // You can access the token ID with `token.id`

                    }

                });



                document.getElementById('customButton').addEventListener('click', function(e) {

                    // Open Checkout with further options

                    handler.open({

                    name: 'Imprintnation',      

                    description: 'Decals',

                    amount: <?php echo $stripeTotal; ?>



                });

                    e.preventDefault();

                });

                </script>

                </form>

Charge Page(charge.php)

<?php

require_once(dirname(__FILE__) . '/config.php');



$token  = $_POST['stripeToken'];



$customer = Stripe_Customer::create(array(

  'email' => '[email protected]',

  'card'  => $token

));



$charge = Stripe_Charge::create(array(

  'customer' => $customer->id,

  'amount'   => 5000,

  'currency' => 'usd'

));



echo '<h1>Successfully charged $5!</h1>';

?>

Configuration Page(config.php)

<?php

require_once('./lib/Stripe.php');



$stripe = array(

secret_key      => 'sk_test_************************',

publishable_key => 'pk_test_************************'

);



Stripe::setApiKey($stripe['secret_key']);

?>

What am I missing here? I can't even get it to retrieve a token.

How can I retrieve a token and charge a card?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

janayr

Add To Favorites

Follow

Total Points: 80

Total Questions: 80

Total Answers: 114

Location: Venezuela

Member since Sat, Aug 22, 2020

4 Years ago

answered 10 Years ago deonkalvinw · Accepted Answer

Finally got it to work. Had to change a bunch of it. Here is the code:

Payment page

<form action=charge.php method=post>

<script src=https://checkout.stripe.com/checkout.js></script>

<script src=http://code.jquery.com/jquery-latest.min.js></script> 



<button id=customButton>Pay with Card</button>

<style>

#customButton{

width:300px;

height:50px;

background-color:orange;

color:white;

border:2px solid green;

}

</style>

 <script>

 $('#customButton').click(function(){

 var token = function(res){

 var $input = $('<input type=hidden name=stripeToken />').val(res.id);

 $('form').append($input).submit();

 };



 StripeCheckout.open({

 key:         '<?php echo $stripe['publishable_key']; ?>',

 address:     false,

 amount:      '<?php echo $price; ?>',

 currency:    'usd',

 name:        'test',

 description: '<?php echo $desc; ?>',

 panelLabel:  'Checkout',

 token:       token

 });



 return false;

 });

 </script>

 <input type=hidden name=desc value=<?php echo $desc; ?>/>

 <input type=hidden name=totalPrice value=<?php echo $price; ?>/>

</form>

charge.php

<?php

require_once(dirname(__FILE__) . '/config.php');



$token  = $_POST['stripeToken'];

$amount = $_POST['totalPrice'];

$desc = $_POST['desc'];

$percent = 0.01;

$realAmount = $amount * $percent;

try {       

$charge = Stripe_Charge::create(array(

    'card' => $token,

    'amount'   => $amount,  

    'currency' => 'usd',

    'description' => $desc

    ));



    } catch(Stripe_CardError $e) {

// The card has been declined

}



echo <h1>Successfully charged $$realAmount!</h1>;

?>

I wish Stripe's documentation was more straightforward but this code handles the charge and it logs it on your dashboard.