Required field in HTML5

To render a mandatory field textbox, we can use the required attribute and for watermark text in we can set placeholder attribute.

Watermark effect

<body>
    <form>
        <input type="text" id="myName" name="myName" placeholder="Please enter your name" />
        *
    </form>
</body>

In the above code snippet, we have set the placeholder attribute of the input type text that brings a watermark to the textbox like below

Output

Required

In order to make this textbox mandatory, we can use required attribute.

<body>
    <form>
        <input type="text" id="myName" name="myName" required placeholder="Please enter your name" />*
    </form>
</body>

Note that required attribute value is optional in HTML 5, we can just write required or required="required". Functionally both are same.

Output

Views: 6789 | Post Order: 90