By: Paul Davis

Page 1 of 1

Set for printing

Problem

I used a JavaScript validation to validate my form and then submit the form, people with JavaScript turned off can't use the form now. How can I use the JavaScript validation and make sure the people without JavaScript on can still submit the form?

Solution

We will use the <noscript> tag to make this happen. First, add back the submit button to the page, right next to the button with the onclick JavaScript validation. Wrap the submit button in a <noscript> tag, like so:

<noscript>
<input type="submit" name="button" id="button" value="Submit" />
</noscript>

Code Block 1: Noscript tag on the submit button

Now when the page loads without JavaScript enabled, both buttons appear. To fix that, attach a class to the normal button, called hideme, like so:

<input type="button" name="button2" id="button2" value="Button" class="hideme" />

Code Block 2: Button with class attached

Now in the HEAD of the document, add another <noscript tag> with a style tag and class in it like so:

<noscript>
<style>
.hideme {
  display:none;
}
</style>
</noscript>

Code Block 3: Code for the HEAD of the document

Now the style for the normal button will only be used when the <noscript> tag is enabled (or working) and the button will disappear while the submit button will be on the page.

Page 1 of 1 1

Download Support Files

Downloads are disabled during your trial period.

Keywords
JavaScript forms, form validation, submit form, JavaScript off