html5 form validation:
html5pattern.com - html5 pattern;
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>html5 form features</title>
<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" />
</head>
<body>
<div class="container">
<form class="well form-horizontal">
<fieldset>
<legend>html5 form features</legend>
<div class="form-actions">
<input type="submit" class="btn btn-primary" value="submit" />
</div>
<div class="control-group">
<label class="control-label" for="text">required text input</label>
<div class="controls">
<input class="input-large" id="text" name="text" type="text" placeholder="required text input" value="" required />
</div>
</div>
<div class="control-group">
<label class="control-label" for="email">required email input</label>
<div class="controls">
<input class="input-large" id="email" name="email" type="email" placeholder="required email input" value="" required />
</div>
</div>
<div class="control-group">
<label class="control-label" for="url">required url input</label>
<div class="controls">
<input class="input-large" id="url" name="url" type="url" placeholder="required url input" value="" required />
</div>
</div>
<div class="control-group">
<label class="control-label" for="tel">required tel input</label>
<div class="controls">
<input class="input-large" id="tel" name="tel" type="tel" placeholder="required tel input" value="" required />
</div>
</div>
<div class="control-group">
<label class="control-label" for="date">required date input</label>
<div class="controls">
<input class="input-large" id="date" name="date" type="date" placeholder="required date input" value="" required />
</div>
</div>
<div class="control-group">
<label class="control-label" for="zip">required zip input</label>
<div class="controls">
<input class="input-large" id="zip" name="zip" type="text" placeholder="required zip input" value="" required pattern="[0-9]*" maxlength="5" min="0" />
<span class="help-inline">only numbers, 0-5 chars, <a href="http://html5pattern.com/">html5pattern.com</a></span>
</div>
</div>
<div class="control-group">
<label class="control-label" for="number">required number input</label>
<div class="controls">
<input class="input-large" id="number" name="number" type="number" placeholder="required number input" value="" required />
</div>
</div>
<div class="control-group">
<label class="control-label" for="min">3 chars minimum</label>
<div class="controls">
<input class="input-large" id="min" name="min" type="text" placeholder="3 characters minimum" value="" required pattern=".{3,}" />
<span class="help-inline">minlenth replacement</span>
</div>
</div>
<div class="control-group">
<label class="control-label" for="minmax">5-10 chars</label>
<div class="controls">
<input class="input-large" id="minmax" name="minmax" type="text" placeholder="5-10 characters" value="" required pattern=".{5,10}" />
<span class="help-inline">minlenth and maxlenth replacement</span>
</div>
</div>
</fieldset>
</form>
</div>
</body>
</html>