CODEWITHSUNDEEP
javascriptvue.js
Abidus Sattar Aziz
Abidus Sattar Aziz

Reputation: 155

How to stop empty input fields from affecting javascript calculation

i am trying to add some values. The problem is if one field is empty, the total calculation doesn't show. How can i solve this problem. all my fields type is number. and i am using vue js

grand_total: function(){
                let x = parseInt(this.formData.total_allowance) + parseInt(this.formData.air_fair);
                this.formData.grand_total = x;
                return x;
            }

here. if one value is empty,the total doesnt show up

Upvotes: 1

Views: 112

Answers (3)

Udochukwu Enwerem
Udochukwu Enwerem

Reputation: 2823

Use the logical 'or' operator in this way:

grand_total: function() {
   let x = (parseInt(this.formData.total_allowance) || 0) + (parseInt(this.formData.air_fair) || 0);
   this.formData.grand_total = x;
   return x;
}

Upvotes: 1

Qonvex620
Qonvex620

Reputation: 3972

try this one

let x = parseInt(this.formData.total_allowance || 0) + parseInt(this.formData.air_fair || 0)

Upvotes: 2

Mamun
Mamun

Reputation: 68923

Instead of parseInt() you can use Number() as this will convert the empty string as 0 where as you will get NaN with parseInt():

let x = Number(this.formData.total_allowance) + Number(this.formData.air_fair);

Upvotes: 3

Related Questions