Member Avatar for IsaacMessi10

onsubmit return false still submitting form

HTML:

<!DOCTYPE html>

<head>
    <script src = "Scripts/script.js"></script>
</head>
<body>
    <form action = "http://posttestserver.com/post.php" method = "post" onsubmit = "return age()">
        <label for = "dob">Date of Birth</label> <input class = "TextArea" type = "date" id = "dob" name = "dob" required/> <br/>
        <p><span id = "invalid">&nbsp;</span><br/></p>
        <input id = "FormSubmit" class = "Buttons" type = "submit" value = "Submit"/>
    </form>
</body>

Javascript:

function age()
{

    var invalidStr = "You must be at least 18 to subscribe.";

    var submitOK = true;

    var dateOfBirth = document.getElementById("dob").value;
    var dateOfBirthD = dateOfBirth.split("/")[0];
    var dateOfBirthM = dateOfBirth.split("/")[1];
    var dateOfBirthY = dateOfBirth.split("/")[2];

    var currentDate = new Date();

    if (dateOfBirthY > (currentDate.getFullYear() - 18))
    {

        document.getElementById("invalid").firstChild.nodeValue = invalidStr;
        submitOK = false;

    }

    return submitOK;

}

PS: External Javascript is not a problem since I have other scripts running in the background which worked fine

  • 2 Contributors
  • 3 Replies
  • 293 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by IsaacMessi10
Member Avatar for JorgeM

I haven't tried your code but maybe the logic is incorrect and you are always returning true.

Make submitOk = false on line 22 to test to make sure the return is working as expected. If it works work your way backwards in your function.

Member Avatar for IsaacMessi10

Ok so I've tried that and it didn't really make a difference.

I've tried this code:

function age()
{

    //alert("Test 01");
    // Success

    var invalidStr = "You must be at least 18 to subscribe.";

    var dateOfBirth = document.getElementById("dob").value;
    var dob = new Date(dateOfBirth);

    //alert("Test 02");
    // Success

    var dateOfBirthD = dob.getDate();
    var dateOfBirthM = dob.getMonth();
    var dateOfBirthY = dob.getFullYear0(); 

    alert("Test 03");
    // Fail

    var currentDate = new Date();

    if (dateOfBirthY > (currentDate.getFullYear() - 18))
    {

        alert("Test 04");

        document.getElementById("invalid").firstChild.nodeValue = invalidStr;
        return false;

    }

    alert("Test 05");

}

It shows that my code is only being 'executed' till Line 13.

I've discussed this issue with my tutor / lecturer. He is willing to help me out. I'll keep this discussion open in the meantime and I'll try to keep you posted.

Thanks :)

Edited by IsaacMessi10
Member Avatar for IsaacMessi10

Turns out I had a Syntax Error

function age()
{

    var invalidStr = "You must be at least 18 to subscribe.";

    var dateOfBirth = document.getElementById("dob").value;
    var dob = new Date(dateOfBirth);

    var dateOfBirthD = dob.getDate();
    var dateOfBirthM = dob.getMonth();
    var dateOfBirthY = dob.getFullYear(); 

    var currentDate = new Date();

    if (dateOfBirthY > (currentDate.getFullYear() - 18))
    {

        document.getElementById("invalid").firstChild.nodeValue = invalidStr;
        return false;

    }

}
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.