Question posted in
You can find the official documentation here.

How do i change the text when i'm submitting – Jquery ajax

I’m not able to change the text at “Enter your age” to “your age is” when submitting. Is there way that when I submit the DOB the “Enter you age” changes to “your age is: X”?

function myFunction() {
  var dobString = document.getElementById("birth_date").value;
  var calculatedValue = calculate_age(dobString);
}

function calculate_age(dobString) {
  var diff_ms = Date.now() - Date.parse(dobString);
  var yearString = "";
  var yearValue = Math.floor(diff_ms / 31536000000);
  console.log("Years ", yearValue);

  if (yearValue > 1) 
    yearString = " years";
  else
    yearString = " year";

  if (yearValue > 0)
    var calculatedValue = yearValue + yearString + " ";
  else if (yearValue == 0)
    var calculatedValue = monthValue + monthString + " ";

  document.getElementById("age").innerHTML = "Your Age is : " + calculatedValue;
}
<form>
  Birthday: <input type="date" name="bday" id="birth_date">
  <br><br>
</form>

<button onclick="myFunction()">view</button><br>
<h2>Enter your age</h2>
<p id="age"></p>
Tags:

3

Answers


  1. 0

    Update template to be

     <h2 id="age">Enter your age</h2>

    And update script to be like this

    document.getElementById("age").textContent = "Your Age is : " + calculatedValue;
    Login or Signup to reply.
  2. 0

    You need to calculate your age a bit differently.
    Maybe something like this:

    function calculate_age(dobString) {
    var birthday = new Date(dobString),  //Year, month, day.
    today = new Date(),
    one_year = 1000*60*60*24*365;
    let yearValue = Math.floor( (today.getTime() - birthday.getTime() ) / one_year);

    let yearString = 'year'
    if (yearValue > 1){ yearString += "s" };

    document.getElementById("age").innerHTML = `Your Age is : ${yearValue} ${yearString}`;
}

    I created a fiddle for you to see it in action:

    https://jsfiddle.net/cdrsfo82/

    Login or Signup to reply.
  3. 0

    It’s simple, just put id="age" on the <h2>

    function myFunction() {
  var dobString = document.getElementById("birth_date").value;
  var calculatedValue = calculate_age(dobString);
}

function calculate_age(dobString) {
  var diff_ms = Date.now() - Date.parse(dobString);
  var yearString = "";
  var yearValue = Math.floor(diff_ms / 31536000000);
  console.log("Years ", yearValue);

  if (yearValue > 1) 
    yearString = " years";
  else
    yearString = " year";

  if (yearValue > 0)
    var calculatedValue = yearValue + yearString + " ";
  else if (yearValue == 0)
    var calculatedValue = monthValue + monthString + " ";

  document.getElementById("age").innerHTML = "Your Age is : " + calculatedValue;
}
    <form>
  Birthday: <input type="date" name="bday" id="birth_date">
  <br><br>
</form>

<button onclick="myFunction()">view</button><br>
<h2 id="age">Enter your age</h2>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search