How to add Required attribute in HTML5 Forms

If you want a text box to be filled in, you can use the REQUIRED attribute:

<FORM>

<INPUT TYPE="Text" PLACEHOLDER="Enter your first name" REQUIRED>

<P>
<INPUT TYPE="Submit" VALUE="Contact Us">

</FORM>

 

You just type the word REQUIRED, with no equal sign or text after it.

Test it out in your browser. Don't click inside of your text box, but just click your submit button. In the latest editions of Firefox, you should see something like this:



In Google's Chrome, you'll see this:



So the browser has not submitted the form, but displayed a popup box asking the user to fill out the text box. Opera, Internet Explorer and Safari don't recognize the REQUIRED attribute, however, and just submit the form. So you shouldn't rely on it. Internet Explorer versions 9 and lower don't even recognise the PLACEHOLDER attribute, the only one of the big five browsers not to do so!