erdum/stripe_add_card.html

## stripe_add_card.html
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Payment Form</title>
    <!-- Include Stripe.js -->
    <script src="https://js.stripe.com/v3/"></script>
</head>

<body>
    <!-- Form to add a new card -->
    <form id="add-card-form">
        <div id="new-card-element">
            <!-- Stripe Elements Placeholder for new card input -->
        </div>
        <button id="add-card-button" type="submit">Add New Card</button>
    </form>
    <br>
    <script>
    // Set up Stripe.js with your publishable key
    const stripe = Stripe('');

    // Create an instance of Elements for the new card form
    const newCardElements = stripe.elements();
    const newCard = newCardElements.create('card');
    newCard.mount('#new-card-element');

    // Handle form submission to add a new card
    const addCardForm = document.getElementById('add-card-form');
    addCardForm.addEventListener('submit', function(event) {
        event.preventDefault();
        stripe.createPaymentMethod('card', newCard).then(function(result) {
            if (result.error) {
                console.error(result.error.message);
            } else {
                console.log(result.paymentMethod);
                // Send payment method ID to your backend to associate with the user
            }
        });
    });
    </script>
</body>

</html>
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Payment Form</title>
	<!-- Include Stripe.js -->
	<script src="https://js.stripe.com/v3/"></script>
	</head>

	<body>
	<!-- Form to add a new card -->
	<form id="add-card-form">
	<div id="new-card-element">
	<!-- Stripe Elements Placeholder for new card input -->
	</div>
	<button id="add-card-button" type="submit">Add New Card</button>
	</form>
	<br>
	<script>
	// Set up Stripe.js with your publishable key
	const stripe = Stripe('');

	// Create an instance of Elements for the new card form
	const newCardElements = stripe.elements();
	const newCard = newCardElements.create('card');
	newCard.mount('#new-card-element');

	// Handle form submission to add a new card
	const addCardForm = document.getElementById('add-card-form');
	addCardForm.addEventListener('submit', function(event) {
	event.preventDefault();
	stripe.createPaymentMethod('card', newCard).then(function(result) {
	if (result.error) {
	console.error(result.error.message);
	} else {
	console.log(result.paymentMethod);
	// Send payment method ID to your backend to associate with the user
	}
	});
	});
	</script>
	</body>

	</html>