javascript Validation Help a total newbie -


i cannot javascript work! need password , re-type password fields, validate both have values , user has entered same password in both fields (i.e. password match) validate password field must more 8 characters.i dont want use alert function instead, highlight uncompleted fields red background , text message next each uncompleted field (in red color) error message.

i have spent 3 days doing this!! appreciated.`

 function validate() {     var fn =       document.getelementbyid("fname");     if (fn.value == "") {         {         document.getelementbyid("fname").style.bordercolor = "red";         return false;         }       return true;     }       function validate() {       var sn =         document.getelementbyid("sname");       if (sn.value == "") {         document.getelementbyid("sname").style.bordercolor = "red";         return false;         }       return true;     }       function validate() {       var un =         document.getelementbyid("uname");       if (un.value == "") {         document.getelementbyid("uname").style.bordercolor = "red";         return false;         }       return true;     }       function checkpass() {       var pass = document.getelementbyid('pass');       var c_pass = document.getelementbyid(' c_pass')       var message = document.getelementbyid('confirmmessage');       var goodcolor = "#66cc66";       var badcolor = "#ff6666";         if (pass.value == c_pass.value) {           c_pass.style.backgroundcolor = goodcolor;         message.style.color = goodcolor;         message.innerhtml = "passwords match!"       } else {           c_pass.style.backgroundcolor = badcolor;         message.style.color = badcolor;         message.innerhtml = "passwords not match!"         }       return true;     }   }
<body>    <form action="linkpage.html" id="myform" method="post" name="myform" onsubmit="return(validate())">    </form>    <br>    <table>      <tr>        <td align="center" colspan="2"><span style="font-size:50px; color:blue;">registration form</span>        </td>      </tr>      <tr>        <td align="center" colspan="2">welcome our website          <br>please fill in <span style=" color:red;">all</span>          <b><ins>fields</ins></b>        </td>      </tr>      <tr>        <td>first name</td>        <td>          <input autofocus="" id="fname" placeholder="enter first name " type="text">        </td>      </tr>      <tr>        <td>last name</td>        <td>          <input id="sname" placeholder="enter last name " type="text">        </td>      </tr>      <tr>        <td>username</td>        <td>          <input id="uname" placeholder="enter username " type "text">        </td>      </tr>      <tr>        <td>age</td>        <td>          <input id="age" placeholder="enter age" type="text">        </td>      </tr>      <tr>        <td>password</td>        <td>          <input id="pass" placeholder="enter password " type="password">        </td>      </tr>      <tr>        <td>confirm password</td>        <td>          <input name="confirm password" id="c_pass" placeholder="re-type           password " type="password" onkeyup="checkpass(); return false;">          <span id="confirmmessage" class="confirmmessage"></span>        </td>      </tr>      <tr>        <td rowspan="2">gender</td>        <td>          <input name="mgender" type="radio" value="male">male</td>      </tr>      <tr>        <td>          <input name="fgender" type="radio" value="female">female</td>      </tr>      <tr>        <td>available</td>        <td>          <input id="checkbox" type="checkbox">        </td>      </tr>      <tr>        <td>course</td>        <td>          <select>            <option value="mobile app">              mobile app            </option>            <option value="cloud">              cloud            </option>            <option value="software development">              software development            </option>          </select>        </td>      </tr>      <tr>        <td class="comments">comments</td>        <td>          <br>          <textarea cols="30" name="comments" placeholder="type comments here." rows="6"></textarea>        </td>      </tr>      <tr>        <td align="center" colspan="4" align="center">          <input name="submit" onclick="return validate()" type="submit" value="register" align="center" />        </td>      </tr>    </table>  </body>

there lot of bugs in code , normal beginner great see trying. have done took @ javascript. not going re-write whole script have commented out part should take @ , try , comment 1 part @ time see problem is. did match password working commenting out other stuff. try now. remove comments line line until stops working again. tell how find other error's in script.

<script>     function checkpass(){        var passvalue = document.getelementbyid('pass').value;        var c_passvalue = document.getelementbyid('c_pass').value;        var c_passid = document.getelementbyid('c_pass');        var message = document.getelementbyid('confirmmessage');        var goodcolor = "#66cc66";        var badcolor = "#ff6666";          if(passvalue == c_passvalue) {            c_passid.style.backgroundcolor = goodcolor;           message.style.color = goodcolor;           message.innerhtml = "passwords match!";         } else {            c_passid.style.backgroundcolor = badcolor;           message.style.color = badcolor;           message.innerhtml = "passwords not match!";         }      }  </script> 

okay issue attempting change color of value of c_pass , not id itself. renamed variables understand why breaking. again checkpass function. if comment out other stuff , use script isolate checkpass function , see works. hope helps.


Comments