validation - Issues changing border color in javascript -

i submitting form, , has validation make sure text box has value. if false, alert displays fine, can't border change color. can't seem find out doing wrong.

<script>     function validate(){         var dob = document.forms["ppm"]["dob"].value;         if(dob == ""){             document.getelementbyid("dob").style.border="red";             alert("error");             return false;         }     } </script>  <form onsubmit="return validate()" name="ppm" id="ppm" action="index.php" method="post">  <p>what dob<br /> <input type="text" name="dob" id="dob" value="" />  <input type="submit" name="continue" value="continue"/> </form> 

you have give border width before visible. can use individual border* properties that:

document.getelementbyid("dob").style.bordercolor ="red"; document.getelementbyid("dob").style.borderwidth ="2px"; 

or, stick border supply full border value (width, style, , color):

document.getelementbyid("dob").style.border = "2px solid red"; 

here's working example modified original:

function validate() {    var dob = document.getelementbyid('dob').value;    if (dob == null || dob == '') {      document.getelementbyid("dob").style.border = "2px solid red";      alert("error");      return false;    }  }

<p>what dob    <br />    <input type="text" name="dob" id="dob" value="" />      <input type="button" onclick="validate()" name="continue" value="continue" />

i'm tempted rewrite validate function this:

function validate() {   var dobel = document.getelementbyid('dob'); // once   if (!(dobel.value || '').length)) { // if null or empty     dobel.style.border = "2px solid red"; // set style     alert("error");     return false; // don't submit form   } else {     // set border normal   }   return true; // submit form }