CODEWITHSUNDEEP
javascripthtml
user10850475
user10850475

Reputation:

Reference Error loading Stripe Elements API

I'm trying to implement the basic test code of Stripe Elements Docs but it doesn't seem to work. I've tried changing the order of the scripts but doesn't work either. The error I get is:

Uncaught ReferenceError: elements is not defined

<form action="/charge" method="post" id="payment-form">
  <div class="form-row">
    <label for="card-element">
      Credit or debit card
    </label>
    <div id="card-element">
      <!-- A Stripe Element will be inserted here. -->
    </div>

    <!-- Used to display Element errors. -->
    <div id="card-errors" role="alert"></div>
  </div>

  <button>Submit Payment</button>
</form>
<script src="https://js.stripe.com/v3/"></script>
<script type="text/javascript">
// Custom styling can be passed to options when creating an Element.
var style = {
base: {
  // Add your base input styles here. For example:
  fontSize: '16px',
  color: "#32325d",
}
};

// Create an instance of the card Element.
var card = elements.create('card', {style: style});

// Add an instance of the card Element into the `card-element` <div>.
card.mount('#card-element');
</script>
</body>

Upvotes: 0

Views: 437

Answers (1)

A. Domeika
A. Domeika

Reputation: 49

You are forgetting to create an instance of stripe and then the instance of elements

Refer to Stripe Docs

Upvotes: 1

Related Questions