forms - javascript function inside function -

i have started javascript , want validate form. tutorials i've found create alert feedback, i'd use onblur , give error message next field. managed 2 functions separately can't merge them. i'd appreciate help!

this came with, doesn't need:

 function validatefirstname()   {      var x=document.forms["demo"]["firstname"].value;      if (x==null || x=="" || x==)       {          function addmessage(id, text)           {                 var textnode = document.createtextnode(text);                 var element = document.getelementbyid(id);                 element.appendchild(textnode);                 document.getelementbyid('firstname').value= ('firstname must filled out')              }          return false;       }   } 

so following simple way validate form field checking value of input when form submitted. in example error messages sent div element form should still out.

the html code looks this:

<div id="errors"></div> <form onsubmit="return validate(this);"> <input type="text" name="firstname" placeholder="what's first name?"> <button type="submit" value="submit">submit</button> </form> 

the javascript code looks this:

function validate(form) { var errors ='';  if(form.firstname.value =="") {     errors += '<li>please enter first name</li>'; } if(errors !='') { //check if there errors, if there are, continue     var message = document.getelementbyid("errors"); //assigns element id of "errors" variable "message"     message.innerhtml = "<ul>" + errors + "</ul>"; //adds error message list error message html     return false; } else {     return true; } } 

once understand should able figure rest out on own or go http://www.w3schools.com/ , check out javascript section out.