How to stop empty input fields from affecting javascript calculation

Question

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

Mamun · Accepted Answer · 2020-01-22 06:01:59Z

3

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);

answered Jan 22, 2020 at 6:01

Mamun

69k9 gold badges51 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Qonvex620 · Accepted Answer · 2020-01-22 06:05:27Z

2

try this one

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

answered Jan 22, 2020 at 6:05

Qonvex620

3,9801 gold badge12 silver badges17 bronze badges

Comments

Udochukwu Enwerem · Accepted Answer · 2020-01-22 06:06:29Z

1

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;
}

answered Jan 22, 2020 at 6:06

Udochukwu Enwerem

2,8932 gold badges28 silver badges37 bronze badges

1 Comment

Udochukwu Enwerem Over a year ago

If you are processing an unknown number of fields you can simply create a separate function that does this same thing for you and returns the appropriate value.

Collectives™ on Stack Overflow

How to stop empty input fields from affecting javascript calculation

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related