mulderu/html5-form-validation-01.html

## html5-form-validation-01.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>HTML5 Form Validation Ex</title>
  <script src="https://code.jquery.com/jquery-3.1.0.js"></script>

</head>
<body>

  <form onsubmit="return false;">
    <label for="choose">Would you prefer a banana or a cherry?</label>
    <input id="choose" name="i_like" required pattern="banana|cherry" >
    <button>Submitx</button>
  </form>

  <script>
    $(document).ready(myInit);
    function myInit() {
      $('#choose').blur(function(e) {

        setTimeout(function() {
          $('#choose')[0].setCustomValidity('hello mulder');
          $('#choose')[0].reportValidity();
        }, 1);

      });


    }
  </script>

</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>HTML5 Form Validation Ex</title>
	<script src="https://code.jquery.com/jquery-3.1.0.js"></script>

	</head>
	<body>

	<form onsubmit="return false;">
	<label for="choose">Would you prefer a banana or a cherry?</label>
	<input id="choose" name="i_like" required pattern="banana\|cherry" >
	<button>Submitx</button>
	</form>

	<script>
	$(document).ready(myInit);
	function myInit() {
	$('#choose').blur(function(e) {

	setTimeout(function() {
	$('#choose')[0].setCustomValidity('hello mulder');
	$('#choose')[0].reportValidity();
	}, 1);

	});


	}
	</script>

	</body>
	</html>