Question

I am currently using Google maps and attempting to use input validation. I require the user to use a number between 0 and 20 to set as a zoom on my location.

Below is the code I am using. The first if statement works perfectly for any number over 20 but the second does not work when I use numbers like 0 and -1 (for instance.)

Any suggestions for fixing this?

function inputIsValid() {

                       console.log("Inside inputIsValid function");

                       //Check for Above 20
                       if (document.getElementById("txtZoom").value  > 20) {
                           alert("Please insertAmount between 0 and 20");
                           document.getElementById("txtZoom").focus();
                           return false;

                           //Check for Number below 0
                           if (document.getElementById("txtZoom").value < 0) {
                               alert("Please insertAmount between 0 and 20");
                               document.getElementById("txtZoom").focus();
                               return false;
                           }
                       }
                   }

Answer 1

The problem is you nested the second check within the first, so it will never be reached. Try this:

function inputIsValid() {
    var zoomValue = document.getElementById("txtZoom").value;

    if (zoomValue > 20 || zoomValue < 0) {
         alert("Please insertAmount between 0 and 20");
         document.getElementById("txtZoom").focus();
         return false;
    }
}