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
Post a Comment