My JavaScript if-else statement isn't functioning properly

Question

My JavaScript if-else statement isn't functioning properly

I'm facing an issue with my if statement not functioning correctly when trying to validate non-numeric inputs for the weight variable upon submission. What could be causing this problem?

   submitBtn.onclick = function(){

    var name = document.getElementById('name').value;
    var weight = document.getElementById('weight').value;
    var pound = weight * 2.20462;

    //Check that the value is a number
    if(isNan(weight)){
     alert("Please enter a number);
    }
   }

You can view the code in action on this JsFiddle link

javascript if-statement conditional-statements

Answer 1

Answer №1

Upon reviewing your code, several issues were identified:

You are trying to use .onclick on submitBtn, which is not defined.
Instead of .isNan(), you should be using .isNaN().
The string passed to your alert() function needs to be properly closed:

//Defining submitBtn
var submitBtn = document.getElementById('submitBtn');
submitBtn.onclick = function(){

    var name = document.getElementById('name').value;
    var weight = document.getElementById('weight').value;
    var pound = weight * 2.20462;

    //Checking isNaN()
    if(isNaN(weight)){

        //Closing the string correctly
        alert("Please enter a number");
    }
}

JSFiddle

Answer 2

Upon reviewing your code, several issues were identified:

You are trying to use .onclick on submitBtn, which is not defined.
Instead of .isNan(), you should be using .isNaN().
The string passed to your alert() function needs to be properly closed:

//Defining submitBtn
var submitBtn = document.getElementById('submitBtn');
submitBtn.onclick = function(){

    var name = document.getElementById('name').value;
    var weight = document.getElementById('weight').value;
    var pound = weight * 2.20462;

    //Checking isNaN()
    if(isNaN(weight)){

        //Closing the string correctly
        alert("Please enter a number");
    }
}

JSFiddle

Answer 3

Answer №2

Consider utilizing the isNaN function.

submitBtn.onclick = function(){

    var username = document.getElementById('username').value;
    var mass = document.getElementById('mass').value;
    var kilogram = mass * 0.453592;

    //Verify that the input is numeric
    if(isNaN(mass)){
       alert("Please input a numeric value");
    }
}

Answer 4

Consider utilizing the isNaN function.

submitBtn.onclick = function(){

    var username = document.getElementById('username').value;
    var mass = document.getElementById('mass').value;
    var kilogram = mass * 0.453592;

    //Verify that the input is numeric
    if(isNaN(mass)){
       alert("Please input a numeric value");
    }
}

My JavaScript if-else statement isn't functioning properly

Answer №1

Answer №2

Similar questions

Tips for including HTML in a JSON request in ReactJS

Unable to Retrieve JSON Output

The icons from FontAwesome in Vue do not update when computed

How come the method $.when().pipe().then() is functioning properly while $.when().then().then() is not working as expected

A guide on utilizing webpack devServer proxy within a create react app

Combining arrays of objects in VueJS

Is it possible to utilize a variable as a column name in MySQL when working with Express?

Expanding circle with CSS borders on all edges

Error encountered in NodeJS: Promise TypeError - res.json is not a function while handling pre-signed URLs. This results in

How do I control the opening and closing of my modal using redux state management?

Tips for extracting a website's dynamic HTML content after AJAX modifications using Perl and Selenium

Save the value entered into an input field using JavaScript and store it in a PHP variable

Guide on how to navigate back to the login page when the access_token in local storage is not defined

Why do my messages from BehaviorSubject get duplicated every time a new message is received?

Understanding variable scopes in the success callback function of a JQuery post request

appending a set of parameters to a website address

Angular's $routeProvider fails to navigate

A step-by-step guide on incorporating universal CSRF tokens using JQuery AJAX

Issue with modal component triggering unexpected page reload

Tips for preventing my component from being duplicated during the development process