I am creating a website where you input when you were born and the code outputs your age in days. I achieve that by using "if" statements. I created a system for detecting invalid inputs. It detects the invalid inputs correctly but it also detects valid inputs as invalid. I'm hoping that someone can help me fix this. Here's the JS code.
function ageInDays() {
// variables
var birthYear = prompt("What Year Were You Born In?");
var ageInDayss = (2021 - birthYear) * 365;
//text
if (birthYear > 1990 && birthYear < 2021) {
var h1 = document.createElement('h1');
var textAnswer = document.createTextNode("You are " + ageInDayss + " days old.");
h1.setAttribute('id', 'ageInDays');
h1.appendChild(textAnswer);
document.getElementById('flex-box-result').appendChild(h1);
}
if (birthYear < 1920 || birthYear != 'NaN' || birthYear > 2021) {
var h1 = document.createElement('h1');
var textAnswer = document.createTextNode("Invalid Input. Please Try Again.");
h1.setAttribute('id', 'ageInDays');
h1.appendChild(textAnswer);
document.getElementById('flex-box-result').appendChild(h1);
}
if (birthYear > 1920 && birthYear < 1990) {
var h1 = document.createElement('span');
var h2 = document.createElement('span');
var textAnswer = document.createTextNode("You are " + ageInDayss + " days old.");
var textAnswer1 = document.createTextNode(" Yikes... that's old.");
h1.setAttribute('id', 'ageInDays');
h2.setAttribute('id', 'yikes');
h1.appendChild(textAnswer);
h2.appendChild(textAnswer1);
document.getElementById('flex-box-result').appendChild(h1).appendChild(h2);
}
}
If you run this code, you can see that if you put a valid input (between 1920 and 2021), it detects the input as invalid. PLEASE help me fix this.
wrap it in an 'if' to validate the input first
// Age In Days
function ageInDays() {
// variables
var birthYear = prompt("What Year Were You Born In?");
//var ageInDayss = (2021 - birthYear) * 365;
const bDate = new Date(birthYear + "-01-01");
const today = new Date();
const diffTime = Math.abs(bDate - today);
const ageInDays = Math.ceil(diffTime / (1000 * 60 * 60 * 24));
// variable css
//text
if (isNaN(birthYear) == false) {
if (birthYear=>1990 && birthYear<=2021) {
var h1 = document.createElement('h1');
var textAnswer = document.createTextNode("You are " + ageInDays + " days old.");
h1.setAttribute('id', 'ageInDays');
h1.appendChild(textAnswer);
document.getElementById('flex-box-result').appendChild(h1);
}
if (birthYear<1990) {
var h1 = document.createElement('span');
var h2 = document.createElement('span');
var textAnswer = document.createTextNode("You are " + ageInDays + " days old.");
var textAnswer1 = document.createTextNode(" Yikes... that's old.");
h1.setAttribute('id', 'ageInDays');
h2.setAttribute('id', 'yikes');
h1.appendChild(textAnswer);
h2.appendChild(textAnswer1);
document.getElementById('flex-box-result').appendChild(h1).appendChild(h2);
}
}else{
var h1 = document.createElement('h1');
var textAnswer = document.createTextNode("Invalid Input. Please Try Again.");
h1.setAttribute('id', 'ageInDays');
h1.appendChild(textAnswer);
document.getElementById('flex-box-result').appendChild(h1);
}
}
Well, your code does what you told it to do. You are checking if the birthyear isn't nan and obviously it isn't. Your if statement should be like this.
if (birthYear < 1990 || birthYear > 2021 || birthYear == "NaN")