javascript - Validation With Java Script and printing -
i have form in html , if fields left blank, javascript print inside fields error. please can 1 give me piece of code validate form , print error on top of form if left blank , not inside fields of form?
my form:
<form id="contact" onsubmit="checkcontactform(); return false;" onreset="resetform();"> <p>fill in form below send me message!</p> <div id="errormessage"></div> <p> <label for=""> </label> <input type="text" name="" id="" onfocus="" /> <p> <label for="name">name:</label> <input type="text" name="name" id="name" onfocus="resetfield(this);" /> </p> <p> <label for="email">e-mail address:</label> <input type="text" name="email" id="email" onfocus="resetfield(this);" /> </p> <p> <label for="message">your message:</label> <textarea name="message" id="message" rows="5" cols="25" onfocus="resetfield(this);"></textarea> </p> <p> <button type="submit">send message</button> <button type="reset">reset form</button> </p>
my javascript:
var requiredfields = ["name", "email", "message"]; function checkcontactform() { var myform = document.forms[0]; (i in requiredfields) { fieldname = requiredfields[i]; if (!myform[fieldname].value || myform[fieldname].value == "error") { myform[fieldname].style.color = "#f66"; myform[fieldname].value = ""; var emptyfields = true; } } if (!emptyfields) { myform.submit(); } } function resetfield(myfield) { if (myfield.value == "error") { myfield.style.color = "#000"; myfield.value = ""; } } function resetform(myform) { var myform = document.forms[0]; (i in requiredfields) { fieldname = requiredfields[i]; myform[fieldname].style.color = "#000"; } }
since html5 there form-validation api (http://www.w3schools.com/js/js_form_validation.asp)
here can find pretty "tutorial": http://www.smashingmagazine.com/2009/07/07/web-form-validation-best-practices-and-tutorials/
Comments
Post a Comment