Do not submit form unless JavaScript is enabled

Question

I have a basic form that I use to register a member. I use the onsubmit event form to populate a hidden form field based on some form fields. It works fine, but I would like the form not to submit if javascript is NOT included. This will ensure that the hidden field is correctly populated on the client machine.

I understand that it is probably best to support registration without javascript enabled, but I would like to work with the current solution that I have.

<form id='member_form' method="post" action="http://www.mysite.com/" onsubmit="build_username();" > 

Answer 1

The problem is that the form is submitted by default.

You cannot cancel the attribute of the action form and add it later using JavaScript, because the browser will use the current page as action , and the form can still be submitted.

In addition, removing the submit button does not help, since the form can still be submitted using the enter key.

But I obey you (pun intended!) This evil idea:

 <form action="#"> .... </form> 

this makes the form almost unbeatable at first, since the goal of the submission is the current page.

Then you must set the correct action attribute using JavaScript.

I can’t think of any reason why this will not work reliably in browsers, except that trying to send it will force the browser to go to the top of the page due to the hash # .

Answer 2

If they need javascript to submit the form, then there is no point even showing them the form.

In light of this, I would recommend something like this

 <noscript> You cannot register without javascript enabled. </noscript> <form id="registration" style="display: none"> <!-- form stuff here --> </form> <script type="text/javascript"> document.getElementById( 'registration' ).style.display = 'block'; </script> 

It's a bit crappy and hacky, but then it needs javascript for a simple web form.

Answer 3

Hiding the submit button will not work because the browser will try to submit the form if you press enter in input type="text" .

What you can try is to add the form element via JavaScript (i.e. do not have it in your HTML).

Answer 4

One way to do this is to have a hidden field by default, something like hunter2 , and then when the form is submitted, javascript will change it to something else. Then you can find out if the user is included in javascript.

Answer 5

Why not just hide the default submit button and show it using JavaScript? This will not prevent the user from submitting the form by pressing the enter key, but it will crop the numbers. You can also display a message with the httml NOSCRIPT element prompting users to enable JavaScript.

Answer 6

Just get rid of any <input type="submit"> or <input type="image"> and replace them with buttons / images that start submitting the form using JavaScript. If there are no controls that trigger sending when JavaScript is disabled, you'll be sure that the view was from JavaScript. Keep in mind that smart users, broken browsers, and other oddities guarantee that corrupt or invalid data will be sent in any way.