Validation of float and not empty in JavaScript

Question

I am new to the world of web development and I am starting with basic applications. I am making a simple web page to add two numbers and trying to perform some basic validations that the input field can not be empty as well as the input must only be a float number.

My index.html:




    
    
    

    
    
    
    
    Add Two Numbers


    
        Add Two Numbers 
        
        First Number
        
        
        
        Second Number

My index.js:

let var1 = document.getElementById("Num1");
let var2 = document.getElementById("Num2");
function validate() {
    if(var1 == "" || var2 == "")
        return false;
    return true;
}

function buttonClick() {
    let sum = parseFloat(var1.value) + parseFloat(var2.value);
    return sum;
}

function result() {
    if(validate()) {
        document.getElementById("Title2").innerHTML = "Sum is: " + buttonClick();
    } else {
        window.alert("Wrong Inputs");
    }
}

The JavaScript code is not performing the validation as well as the summation.

user_10647431 · Answer

Simple fix for solution is make the input fields to type number.

change the validate function as below

 function validate() {
  const reg = /\-?\d+\.\d+/g;
  if (
    var1.value !== "" &&
    var2.value !== "" &&
    var1.value.match(reg) &&
    var2.value.match(reg)
  ) {
    return true;
  }
  return false;
}

user_10917206 · Answer

Change this

function validate() {
if(var1 == "" || var2 == "")
    return false;
return true;

}

to

function validate() {
if(var1.value == "" || var2.value == "")
    return false;
else
    return true;
}

this should work.

Validation of float and not empty in JavaScript

2 Answers