Disable field validation…to a certain point

  • Resolved wp1605982g2n

    (@wp1605982g2n)


    3 years, 10 months ago

    Hi,
    I have built a multi-step checkout, basically I have split the checkout form into several sections and I show/hide them based on current step.
    However, this plugin’s validation prevents my code from submitting the checkout form and always returns an error “Your card number is incomplete” – yes, I know it’s incomplete because I still do not see that last section and I cannot enter card number ??
    Basically, my code is submitting the form and if no errors are returned it goes to next step. I can easily turn off Woocommerce validation using filters, but I do not know how to turn off your plugin’s validation until I reach that last step?
    Thank you in advance, I hope I could explain it well..

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Payment Plugins

    (@mrclayton)

    Hi @wp1605982g2n,

    Have you considered not using the checkout form submit as the event to proceed to the next step? Semantically it might make sense to use your own next step button that way you have full control over the event and it’s propagation.

    The credit card form’s validations are kicked off by the click event on the place order button. If you ensure your click event is loaded before the Stripe plugin you can just stop the event from bubbling up.

    Kind regards

    Thread Starter wp1605982g2n

    (@wp1605982g2n)

    Have you considered not using the checkout form submit as the event to proceed to the next step? Semantically it might make sense to use your own next step button that way you have full control over the event and it’s propagation….

    Yes, but that means I would need to create some other validation system that might fail, when I submit the form I fully rely on Woocommerce validation and make sure everything is fine before going to next step.

    …The credit card form’s validations are kicked off by the click event on the place order button.

    Actually, I am using my own button, but I don’t think the credit card form’s validations are kicked by the click event.. Might I be wrong? My button has different id and class than “confirm order” button, and I see no click events bound on it.
    I rely on Woo validation since I use $( document.body ).on('checkout_error', function(){... but Woo validation is not taking place at all since the form is not submitted.

    I use this approach for multi-step thing: https://www.digamberpradhan.com/woocommerce-2-step-checkout/

    Plugin Author Payment Plugins

    (@mrclayton)

    Hi @wp1605982g2n,

    The checkout_error is only triggered when the WC validation fails server side. That is not triggered during any client side validation which is what my plugin does. Your code would be much faster if you performed client side validations instead of submitting the form then returning a response and displaying the next step.

    Anytime the value of a field inside the checkout form changes, the WooCommerce validat_field function located in checkout.js is called. If the field is invalid, it adds a class woocommerce-invalid. Why not have your code check the fields for that class and if all fields in your section are valid, progress to the next step.

    That will make your code faster.

    Here you can see the credit card gateway performs validations when the place order button is clicked, or when the form submits and calls the .

    https://plugins.trac.www.ads-software.com/browser/woo-stripe-payment/tags/3.2.15/assets/js/frontend/credit-card.js#L35

    https://plugins.trac.www.ads-software.com/browser/woo-stripe-payment/tags/3.2.15/assets/js/frontend/credit-card.js#L224

    It’s the code listening for the checkout_place_order_stripe_cc event that is being triggered and performing the validation. If you really want to continue doing it the way you are, just change the value of the input name="payment_method" value="stripe_cc" to some random gateway name like value="stripe_cc_waiting". And when all your steps and validations are complete you can change its value back to stripe_cc. The reason this works is WC triggers an event checkout_place_order_${payment_method} when the form is submitted. But if you have the html input’s value changed, it will not trigger the event that the credit card gateway is listening to.

    Kind Regards,

    Thread Starter wp1605982g2n

    (@wp1605982g2n)

    @mrclayton thank you, you have been extremely helpful!

    Not only your guide helped me solve the problem, but I have learned a couple of things along the way.
    Thumbs up for your quick replies, too.

    Kind Regards!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Disable field validation…to a certain point’ is closed to new replies.