<head>
<script src="https://js.stripe.com/v3/"></script>
<script src="checkout.js" defer></script>
</head>
<body>
<!-- Display a payment form -->
<form id="payment-form">
<div id="payment-element">
<!--Stripe.js injects the Payment Element-->
</div>
<input type="number" value="50" id="amount1" name="amount1">
<button id="submit">
<div class="spinner hidden" id="spinner"></div>
<span id="button-text">Pay now</span>
</button>
<div id="payment-message" class="hidden"></div>
</form>
checkout.js:
const stripe = Stripe("test_key_here");
const items = [{ id: "55" }];
// Here's the js function
// Fetches a payment intent and captures the client secret
async function initialize() {
const { clientSecret } = await fetch("create.php", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ items }),
}).then((r) => r.json());
elements = stripe.elements({ clientSecret });
const paymentElementOptions = {
layout: "tabs",
};
create.php:
require_once 'autoload.php';
require_once 'secrets.php';
$stripe = new \Stripe\StripeClient($stripeSecretKey);
function calculateOrderAmount($TrueAmount): int {
$TrueAmount = 50;
// If I try to change the amount to a variable $_POST['amount1'] it will error: JSON.parse unexpected character at line 1
return $TrueAmount;
}
// Create a PaymentIntent with amount and currency
$paymentIntent = $stripe->paymentIntents->create([
'amount' => calculateOrderAmount($jsonObj->items),
'currency' => 'usd',
'metadata' => ['order_id' => '1234'],
// In the latest version of the API, specifying the `automatic_payment_methods` parameter is optional because Stripe enables its functionality by default.
'automatic_payment_methods' => [
'enabled' => true,
],
]);
If I set a default amount, it works just fine (50 for example). I'm just a newbie that's looking to capture the value from the input on checkout.html (id = amount1, name=amount1). Whatever value that input is set to is the amount that I would like to charge. Please note, at this point, I'm not worried about sending over any other data, I'd just like to start with this. Thank you much!