Q:

How to prevent result and input data from vanishing while using form submit in Javascript

I have been trying to prevent the result in the p tag and the input from date from vanishing after showing the output for a second after I submit the form because later a secondary program is unable to read the data from the p tag.
Please help!!

function Adate(){
    var edate= document.getElementById("dob").value;
    var res = document.getElementById("result");
    var tday = new Date();
    var bdate = new Date(edate);
    var agedate= tday.getFullYear() - bdate.getFullYear();
    if(agedate>=0)
    {
        res.textContent ="You are "+agedate ;
    }
    else
    {
        res.textContent ="You are from the future!!";}
}
<body>
    <form onsubmit="return Adate()">
        Enter your DOB: 
        <input type="date" id = "dob" >
        <input type="submit" value ="submit">
    </form>
    <p id="result"> 
    </p>
</body>

A:

Just add return false; to the end of the function Adate(), and this should do the trick:

function Adate(){
    var edate= document.getElementById("dob").value;
    var res = document.getElementById("result");
    var tday = new Date();
    var bdate = new Date(edate);
    var agedate= tday.getFullYear() - bdate.getFullYear();
    if(agedate>=0)
    {
        res.textContent ="You are "+agedate ;
    }
    else
    {
        res.textContent ="You are from the future!!";}
    return false;
}
<body>
    <form onsubmit="return Adate()">
        Enter your DOB: 
        <input type="date" id = "dob" >
        <input type="submit" value ="submit">
    </form>
    <p id="result"> 
    </p>
</body>

Here, return false; basically means that the page will not try submitting the form to some backend, hence it will not refresh the page.

