I am trying to integrate Stripe's checkout. I am using https://checkout.stripe.com/checkout.js
.
I have a amount's input box on the form and I want to pass that input box's value to Stripe's script.
<input id="amount" name="amount" type="text" class="form-control" placeholder="Enter amount" onKeyUp="calculate()" pattern="^[0-9]*$">
Heres my stripes script
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="<?php echo $stripedetails['publishable_key']; ?>"
data-amount="1000"//<-Amount here
data-name="KAEM Technologies USA, Inc"
data-email="<?php echo $email;?>"
data-currency="<?php echo $curr_code; ?>"
data-description="Widget"
data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
data-locale="auto">
</script>
I tried using COOKIES
, I tried to assign js function's var to php using
var x = document.getElementById('amount').value;
<?php $amount = "<script>document.write(x)</script>";?>
So how can I pass input box's value to stripe's script without submitting the form.
Thanks
@barmar heres the code I tried:
<button type="submit" id="custombutton" class="btn btn-primary" ><i class="fa fa-cc-stripe"></i> Pay Via Card </button>
<script src="https://checkout.stripe.com/checkout.js"></script>
<script>
var handler = StripeCheckout.configure({
key: 'pk_test_DzL83GJnn9U4lMBuk311P1hK0026zJJrLW',
image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
locale: 'auto',
token: function(token) {
// You can access the token ID with `token.id`.
// Get the token ID to your server-side code for use.
}
});
document.getElementById('customButton').addEventListener('click', function(e) {
// Open Checkout with further options:
handler.open({
name: 'KAEM Technologies (USA), Inc.',
description: '2 widgets',
amount: 2000
});
e.preventDefault();
});
// Close Checkout on page navigation:
window.addEventListener('popstate', function() {
handler.close();
});
</script>
Is this right ?