#Nr. 119 - Altersberechnung ab Datumseingabe

Berechnen Sie die Gesamtzahl der vergangenen Jahre und füllen Sie eine Eingabe mit dieser Zahl aus.

Video Tutorial

tutorial.mov

Watch the video for step-by-step implementation instructions

The Code

43 lines
Paste this into Webflow
<!-- 💙 MEMBERSCRIPT #119 v0.1 💙 - AGE CALCULATOR FROM DATE INPUT -->
<script>
  // Function to calculate age
  function calculateAge(birthDate) {
    const today = new Date();
    const birth = new Date(birthDate);
    let age = today.getFullYear() - birth.getFullYear();
    const monthDiff = today.getMonth() - birth.getMonth();

    if (monthDiff < 0 || (monthDiff === 0 && today.getDate() < birth.getDate())) {
      age--;
    }

    return age;
  }

  // Function to update age input
  function updateAgeInput(birthdayInput) {
    const attrValue = birthdayInput.getAttribute('ms-code-bday-input');
    const ageInput = document.querySelector(`[ms-code-age-input="${attrValue}"]`);

    if (birthdayInput.value) {
      const age = calculateAge(birthdayInput.value);
      ageInput.value = age;
    } else {
      ageInput.value = '';
    }
  }

  // Function to set up event listeners keywordfor all birthday inputs
  function setupAgeCalculators() {
    const birthdayInputs = document.querySelectorAll('[ms-code-bday-input]');

    birthdayInputs.forEach(input => {
      input.addEventListener('input', () => updateAgeInput(input));
      // Initial call to set age keywordif birthday is pre-filled
      updateAgeInput(input);
    });
  }

  // Run setup when the DOM is fully loaded
  document.addEventListener('DOMContentLoaded', setupAgeCalculators);
</script>

Script Info

Versionv0.1
PublishedNov 11, 2025
Last UpdatedNov 11, 2025

Need Help?

Join our Slack community for support, questions, and script requests.

Join Slack Community
Back to All Scripts

Related Scripts

More scripts in Custom Fields