change the html 5 form validation defult error message - Mostlikers

07 February, 2014

change the html 5 form validation defult error message

Hi Guys, this is a post on the validation where in you will be learning how to change the default message of the form validation. The code is simple and basic, it uses the JavaScript events line 'onchange' and 'oninvalid'.

For more validation code, click here



View code         Live demo

HTML

<form name="mostlikers" method="post">
<h2>Form validation</h2><p
><label>Enter your Email</label>
<input type="email" required oninvalid="setCustomValidity('Plz Enter check your Email id ')" 
placeholder="ex:jo@gm.com" onchange="try{setCustomValidity('')}catch(e){}" /></p>
<input type="submit"  value="Check Email"/>
</form>


In the code two JavaScript events are used.

  • Oninvalid event gets triggered, if the data is not entered or is invalid.
  • Onchange event is triggered when the input field is changed.

NOTE:
You can run the 'onchange' and 'oninvalid' events in the script tag.

Demo




No comments:

Post a comment