Stripe Checkout Charge using JSF: Form being submitted twice

Question

The form is being submitted twice: 1. On Page Load 2. When user clicks on Checkout's button

I want to avoid the first submission, it is throwing an error because the token returned is null: com.stripe.exception.InvalidRequestException: Invalid source object: must be a dictionary or a non-empty string. See API docs at https://stripe.com/docs '; request-id: req_DjRbT4rGULYGnB

Following the documentation I added the following code to my XHTML:

<div>
<form submit="#{studentBean.chargeStudent()}" method="POST">
                <script
                    src="https://checkout.stripe.com/checkout.js" class="stripe-button"
                    data-key="pk_test_xxxxxx"
                    data-amount="111"
                    data-name="myApp"
                    data-description="Example charge"
                    data-zip-code="true"
                    data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
                    data-locale="auto">
                </script>
            </form>
</div>

Here is my Managed Bean's function:

@Named
@ViewScoped
public class StudentBean implements Serializable {

@EJB
StripeChargeLogic stripeChargeLogic;

public void chargeStudent(){
    Map<String,String> requestParams = FacesContext.getCurrentInstance().getExternalContext().getRequestParameterMap();

    logger.info("charge:" + requestParams.get("stripeToken"));

    stripeChargeLogic.chargeStudent(requestParams.get("stripeToken"));
}
}

Can someone please guide me why the form is being submitted twice and how I can prevent the submission during page load Thank you!

Answer 1

You are not doing jsf here, you have plain html, most likely (but mot clear from you post) in an xhtml/facelets file but not JSF.

In your form action you have an EL that, since it all is in no way related to jsf, is called on page load, sort of like what hapens here

The rest of the behaviour is even more 'undefined' because of this. Take a step back and learn the basics of web technology and jsf and then look at your problem again