stripe / react-stripe-js

React components for Stripe.js and Stripe Elements
https://stripe.com/docs/stripe-js/react
MIT License
1.75k stars 267 forks source link

[BUG]: Need to not be able submit a form with Return Key #515

Closed gabrielmirandat closed 1 month ago

gabrielmirandat commented 3 months ago

What happened?

I am using stripe CardElement, and when pressing Return key inside it my submit handler is called. But I have a use case here that it must not be possible submit my form with Return key (actually with any keyboard key), only with my button. As it is not possible to get keydown events from CardElement due to security matters, how can I be able to do that? I saw there exists an onEscape event when scape is pressed inside the component...could that have a onReturn so I can prevent it there? Please, show me a light in the end of the tunnel. Thanks.

Environment

No response

Reproduction

No response

stale[bot] commented 2 months ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

brendanm-stripe commented 1 month ago

The form submission should be something happening outside of the Card Element, under the control of your application. Depending on the details of your form, there are several other approaches to block form submit beyond keypress events: https://stackoverflow.com/questions/895171/prevent-users-from-submitting-a-form-by-hitting-enter

Since this is not specifically an issue with this helper library, if the above does not solve your issue please write in to support about this and try to include a work minimal reproduction of the issue.

https://support.stripe.com/contact