I currently have a html5 form with a basic text-area inside of it, when you hit the submit button a php script is called that sends the data to the database.
However, before the PHP script is called, I would like to run some validation on the form (checking if it is null etc...) before the PHP is called, preferably in javascript.
Is there a way I can do this?
Thanks.
Html5 form:
<form action="submit.php" method="POST">
<tr>
<td id="textBox-back">
<textarea id="rage-box" type="text" name="rage" cols="40" rows="5" maxlength="160"> </textarea>
<input id="submit" value="" name="submit" type="submit"/>
</td>
</form>
<script language="javascript">
function validate(){
//Code of validation
return false;
}
</script>
<form action="submit.php" method="POST" onsubmit="return validate();">
<tr>
<td id="textBox-back">
<textarea id="rage-box" type="text" name="rage" cols="40" rows="5" maxlength="160"> </textarea>
<input id="submit" value="" name="submit" type="submit"/>
</td>
</form>
You need to add an onclick on your submit or form.
var sub = document.getElementById('submit');
var tex = document.getElementById('rage-box');
sub.onclick = function(e){
if(tex.value == ''){
//stopping it from being sent
e.preventDefault();
alert('make sure everything is filled out');
}
}
If you add the event on your form you need to: