Javascript wont validate form -
currently have form has 3 text inputs. when "submit" button pressed calls javascript function validates form , submits form. problem form still being submitted without valid inputs. if tell me why happening appreciated.
<html> <head lang="en"> <meta charset="utf-8"> <title>goal input</title> <link href="agilegoals.css" rel="stylesheet"> <script type="text/javascript"> function addsubgoal(){ var table = document.getelementbyid("goalinput"); var row = table.insertrow(table.rows.length); row.insertcell(0).innerhtml = "subgoal:"; row.insertcell(1).innerhtml = "<input type='text' name='subgoal'>"; } function submit(){ var goodinput = true; var name = document.getelementbyid("goalname").value; var length = document.getelementbyid("goallength").value; if(name==""){ goodinput=false; document.getelementbyid("nameerror").innerhtml = "<em>must enter name.</em>"; } if(length==""){ goodinput=false; document.getelementbyid("lengtherror").innerhtml = "<em>must enter length</em>"; }else if(isnan(length)){ goodinput=false; document.getelementbyid("lengtherror").innerhtml = "<em>must number</em>"; } else if(length%1!=0){ goodinput=false; document.getelementbyid("lengtherror").innerhtml = "<em>must integer</em>"; } if(goodinput){ document.getelementbyid("goalfoarm").submit(); } }; </script> </head> <body> <form id="goalform" action="server" method="post"> <table id="goalinput"> <tr> <td>goal name:</td> <td><input type="text" name="goalname" id="goalname"></td> <td id="nameerror"></td> </tr> <tr> <td>goal length(months):</td> <td><input type="text" name="goallength" id="goallength"></td> <td id="lengtherror"></td> </tr> <tr> <td>subgoal:</td> <td><input type="text" name="subgoal"></td> </tr> </table> <input type="button" onclick="addsubgoal()" value="add subgoal"> <input type="button" onclick="submit()" value="submit"> </form> </body> </html>
i think missing call preventevent in validation function.
first, alter declaration of submit button this:
<input type="button" onclick="return submit()" value="submit"> secount, modify signature of validation function this:
function submit(e){ third, if validation fails, execute line:
e.preventdefault(); return false; this prevent form submitted errors. hope helps.
Comments
Post a Comment