Skip to main content

Subscribe to GoRails to get access to this episode and all other pro episodes, and new awesome content every month.

Subscribe Now
Only $19/month

Unlimited access. Cancel anytime.

18 Stripe Elements Javascript

Episode 197 · July 10, 2017

Learn about Stripe's new v3 Javascript library, Stripe Elements, and how to implement it for an even nicer credit card form

Payments Javascript


Subscribe or login to view the transcript for this episode.


emil mircea (100 XP) on

Great tutorial! Seems that the new elements library is easy to use. I was wondering how would I go about implementing Stripe Elements in a e-commerce site with a React Front-End and a Rails API backend. Any ideas / suggestions ?

Andrew Vathana (70 XP) on

The below error is thrown in the console from the code in your repo. It looks like its being called on other pages as well.
```Uncaught Error: The selector you specified (#card-element) applies to no DOM elements that are currently on the page.
Make sure the element exists on the page before calling mount().```

funnelvisionaus on

Hi Andrew, your JS is running before the page has finished rendering. You need to move the <script> to below the HTML on the page, or put it in jQuery and wait for the DOM to stop loading.

Mark Nelson (10 XP) on

I have an error where the iframe is not being displayed. Clicking the Submit Payment button shows the Your card number is incomplete error message. I also see the error reported by Andrew. Looking at Stackoverflow there seem to be a number of current issues with Stripe and Turbolinks.

Jonathan Dueck (10 XP) on

Hi, I'm watching this as part of the Stripe MasterClass.

In subscriptions.js, my 'public_key' variable works. But when I then declare the 'stripe' variable, it doesn't seem to know what 'Stripe' is, because 'Stripe(public_key)' returns undefined. Any hints? Thanks.

Login or create an account to join the conversation.