I am using php to store information into a database and I want to use javascript to validate the form. I created a separate javascript file for form validation, which is included in index.php, but whenever I click submit and look at console in google's developer tools I get:
index.php:92 Uncaught ReferenceError: popupValidation is not definedonsubmit @ index.php:92
Here is the code:
index.php
<form name="popup" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" onsubmit="return popupValidation();" method="post">
<div class="row">
<input name="firstName" type="text" class="form-control" id="inputFirstName" placeholder="First Name">
<input name="lastName" type="text" class="form-control" id="inputLastName" placeholder="Last Name">
</div>
<div class="row">
<input name="email" type="email" class="form-control" id="inputEmail" placeholder="youremail@email.com">
</div>
<div class="row">
<input name="password" type="password" class="form-control" id="inputPassword" placeholder="password">
</div>
<div class="row">
<input name="repeatPass" type="password" class="form-control" id="retypePassword" placeholder="Retype password">
</div>
<div class="row">
<input name="trainer" type="checkbox"/> Sign up as trainer
</div>
<div class="modal-footer popup-footer">
<input type="submit" class="btn btn-default submit" value="Register">
</div>
</form>
popupvalidation.js
$(document).ready(function(){
function popupValidation() {
var fname = document.forms["popup"]["firstName"].value;
var lname = document.forms["popup"]["lastName"].value;
var pass = document.forms["popup"]["password"].value;
var repass = document.forms["popup"]["repeatPass"].value;
var email = document.forms["popup"]["email"].value;
if (fname==null || fname=="", lname==null || lname=="", pass==null || pass=="",
repass==null || repass=="", email==null || email=="") {
alert("Pleases fill out field");
return false;
}
}
})