View Full Version : E-commerce prevent form submit help

10-10-2011, 08:34 PM
I am using an e-commerce solution to run my web business. The checkout portion of the website is COMPLETELY closed off to me and I can't access the files.

What I need: A javascript example / solution that will prevent someone from submitting a form without first filling in a field.

What I currently have is a series of radio buttons built into the checkout process. It displays 20 options and the customer has to choose which one of the twenty options applies to them. Each customer only has 2 valid options to choose from based on their zip code, but currently the other zip code shipping options are listed as well.

I have built a javascript that works great hiding all of the shipping options, taking data from the customer, and then only showing the correct shipping option. The problem is, if the customer doesn't fill this out, then they can just hit submit and pay the default shipping option without ever seeing that they didn't choose the correct zip code. What can I do to prevent them from submitting the form? The submit form is a button and there are 6 other buttons and none of them have any identifying factors.

Old Pedant
10-10-2011, 09:38 PM
Well, first of all you are in trouble: What happens if the user simply disables JavaScript in his/her browser? None of your validations will do anything at all, and who knows what kind of bad data will be submitted to the checkout process.

A better solution would be, in addition to the JS based validation, that your <form> submits to some server-side code on your site (PHP/ASP/JSP) that does server-side validation (so it repeats the JS validation, just in case) and only then forwards the <form> data to the checkout process.

If that's not a viable option, then you will have to *INSIST* that the user have JavaScript enabled. And the simplest way to do that is to *NOT* use a submit button to submit the <form>.

Instead, just use an ordinary button <input type="button" value="Submit order" onclick="validateAndSend(this.form);" />

And change your validation so that it, in turn, calls the form's submit() method only if the validation is fully passed.

DO NOT HAVE ANY OTHER WAY of submitting the form.

Now, even if the JS code encounters an error, it won't reach the bottom of the validation where you call the submit() method, so the form won't get submitted.

About as safe as you can get without server-side validation.

If you would show us some code, we could make more comments on how good (or bad) your validation is and help you with it. But no code, no way for us to help more.