Adding Stripe update card form, Cancel, and Resubscribe Discussion
Hello Chris! Thx for a great episode! So i noticed in this video that you updated some field on the current user to save the last 4 etc on the card. I was thinking that i could use that function to update other fields for the user as they subscribe to my service. I use pundit to setup a role based access to my app and i was successful in changing the role from demo to premium at the same time as they added a card and subscribe to my services but when i also try to update other fields it fails.. could the reason it fails be because of the way the form is built?
That form should work just fine for that. If they're submitting other information, for those fields you'll want to make sure they have the 'name' attribute so they get submitted (unlike the credit card fields). Aside from that, make sure you're permitting those extra params and that should probably do the trick.
Have you had the issue where the pay button doesn't respond until you either have reloaded the page or clicked it 2 or 3 times?
Nope, but might want to check to see if you've got JS errors or conflicts with Turbolinks.
I had same issue and its a simple fix.
Turbolinks is the problem so to fix wrap your stripe javascript function like so in your coffee file:
ready = ->
...
the stripe functions go here
...
$(document).ready(ready)
$(document).on('page:load', ready)
Band Eras
Awesome episodes Chris...got me through many huddles!! One question: How do I display the dates of the current billing period to the user on the Edit page? I would like to show the date when the current payment expires.
Thanks
I think the current_period_end timestamp on the Stripe Subscription is what you want there. You could cache this on the user so you don't have to hit their API every time.
Thanks again Chris for this. For some reason my "Card update" is giving the following error:
"Invalid source object: must be a dictionary or a non-empty string. See API docs at https://stripe.com/docs"
I have exactly the same code as you do. When I inspect the element on this page it says:
Failed to load resource: the server responded with a status of 500 (Internal Server Error)
Not sure why, but has anyone witnessed this issue? See screenshot for error message. Thanks.
First I would check to make sure that the user has a stripe_subscription_id saved in the record. You might be passing a nil in on accident.
Hi Chris,
How easy is it to extend this so that if a payment does not succeed (say a renewal), the user's account is downgraded to basic (Free) account automatically?
Pretty simple. You'd need to basically listen for the subscription cancellation webhook to come across and then in there you can just move the user's plan over. The webhook will be your way of knowing that the last payment attempt failed and the user's paid subscription canceled. It'll just send a notification to your server and as long as you're listening for it, you can run the code to downgrade to the free plan. Make sense?
Check out this episode on the webhook stuff if you haven't already: https://gorails.com/episode...
Hi Chris,
Great tutorial. I wanted to pick your brain for a second. I followed your tutorial to the letter aside from using rails 5.0.2 and Bootstrap V4. For some reason when in the process of resubscribing a customer who needs to update to a new payment method using the "Use a different card" button, the hidden form only appears for a second and then disappears. I've checked my code against yours on Github and everything appears in order. If I click into one of the form fields before it disappears, the form will not go away but when I click on the submit button, the customers card is not updated. Any thoughts?
Hmm, hard to say. I would start by inspecting the HTML and then stepping through the JS code line by line and making sure those are working as expected. You'll figure it out pretty quickly if you break it down and find the spot that's not working like you want it.
Charles Williams
Hey Chris, I am getting same error Fusi had below.Also like Fusi nothing is returning Nil and it fails same way as his screen shot. I also just completed your newer Stripe Elements Javascript and got everything to work there no problem. My main question though is I don't know how to combine the Jquery in this video into the Javascript of the new first video in this series. I don't know how or if you can combine both jquery and javascript together in the subscription.js file. I also don't know how to convert the jquery to Javascript if that is the right way to go. The only warning and only .js in my app is the line var stripe = Stripe(public_key); this is saying Stripe is not defind. Thanks in advance for your help.