0

Im having some issues with javascript validation, I followed the tutorial on javascript validation from W3Schools - http://www.w3schools.com/js/js_validation.asp which was helpful, but Im having an issue with changing the html of a p tag when there is an error, currently with the code it doesnt return the value as false it just submits the form even when the input is empty. The idea was to change the p tag ".form-error" when the input is missing, my code is as follows:

function validateForm() {
        var x = document.forms["competition"]["fname"].value;
        if (x == null || x == "") {
            console.log("First name must be filled out");
            return false;
            document.getElementById("#form-error").innerHTML = "First name must be filled";


        }
 }

and my form:

<form id="competition" action="{{store url='../comp/checker.php'}}" method="post" name="competition" onsubmit="return validateForm()" >
<p id="form-error"></p>
<input type="text" id="fname" name="fname" />
<input type="submit" id="submit" name="submit" value="Enter" />
</form>

jsfiddle here - https://jsfiddle.net/kve788r8/

Any help would be appreciate :)

MrJoshFisher
  • 1,143
  • 5
  • 21
  • 48
  • Wrap `script` in `body/head`..Check `console` for errors.. Inline-events should reside in `global-context`.. __Error: `validateForm is not defined`__ – Rayon Apr 12 '16 at 07:50
  • `onsubmit="return validateForm()"` might be the reason. As far as I know you cannot use this sort of statement. – Dellirium Apr 12 '16 at 07:51

0 Answers0