Html5 Cool Tips snippets that maybe you dont know

Wednesday 02th, Dec, 2015 | #

Autocompletion with HTML5 datalists

A DATALIST element gets an ID attribute and contains numerous OPTION elements, just as a SELECT element would:

Run Code

<p>Type php for view example</p>
<input name="resources" list="resources" />

<datalist id="resources">
	<option value="php">
	<option value="php 4">
	<option value="php 5">
	<option value="css">
	<option value="css3">
</datalist>

Form Validation with required

The required attribute marks any input/textarea as being required to have a value before the form can be submitted.

Run Code

<form >
    <fieldset>
        <legend>Required Example</legend>
        <div>
            <label for="name">Name (required):</label>
            <input type="text" id="name" name="name"  required="true">
        </div>
        <div>
            <label for="email">Email (required):</label>
            <input type="email" id="email" name="email"  required="true">
        </div>
        <div>
            <label>Website:</label>
            <input type="url" id="website" name="website" required="true">
        </div>
        <input type="submit" value="Submit"/>
    </fieldset>
</form>