Multiple OR conditions in Javascript Function

Question

I am trying to use multiple form ids inside a javascipt function, but it doesn't work. The code is:

    $('#Rate1').keyup(function(){
    var Amt1;
    var Amt2;
    var Amt3;
    var Amt4;
    textone = parseFloat($('#Amt1').val());
    texttwo = parseFloat($('#Amt2').val());
    textthree = parseFloat($('#Amt3').val());
    textfour = parseFloat($('#Amt4').val());
    var result = textone + texttwo + textthree + textfour;
    $('#TotalInvoiceValue').val(result.toFixed(2));


});

And I want to use multiple ids like this:

$('#Rate1' || '#Rate2' || '#Rate3' || '#Rate4').keyup(function(){
    var Amt1;
    var Amt2;
    var Amt3;
    var Amt4;
    textone = parseFloat($('#Amt1').val());
    texttwo = parseFloat($('#Amt2').val());
    textthree = parseFloat($('#Amt3').val());
    textfour = parseFloat($('#Amt4').val());
    var result = textone + texttwo + textthree + textfour;
    $('#TotalInvoiceValue').val(result.toFixed(2));


});

But it's not working. Please point out what I am doing wrong here..

If you have a better suggestion to use something other than keyup is also welcomed.

Possible duplicate of jQuery same click event for multiple elements — Randy Casburn
– Randy Casburn, Commented May 20, 2018 at 2:32

eddiewould · Accepted Answer · 2018-05-20 02:33:00Z

3

It sounds like you just want to assign the same event handler to multiple selectors.

https://api.jquery.com/multiple-selector/

Try using comma ',' instead of logical or '||'

I.e

$('#Rate1, #Rate2, #Rate3, #Rate4').keyup(function(){
var Amt1;

answered May 20, 2018 at 2:33

eddiewould

1,65320 silver badges41 bronze badges

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

3 Comments

Jon Uleis Over a year ago

Alternatively, give the elements a shared class (like class="rate") and use the class as your jQuery selector: $('.rate')

Cody Coderson Over a year ago

@JonUleis Hi can you show how I can assign multiple elements in a class?

Jon Uleis Over a year ago

@CodyCoderson I just did! If you included some HTML I could point it out better.

poorly-written-code · Accepted Answer · 2018-05-20 04:26:55Z

0

The first answer answers your question exactly. But as the comments mention, using classes can simplify things and is more flexible.

html

<input id="Amt1" class="rate" type="text">
<input id="Amt2" class="rate" type="text">
<input id="Amt3" class="rate" type="text">
<input id="Amt4" class="rate" type="text">

javascript

$('.rate').on('keyup', function() {
  let result = 0;
  $('.rate').each(function() { result += parseFloat(this.value); });
  $('#TotalInvoiceValue').val(result.toFixed(2));
})

answered May 20, 2018 at 4:26

poorly-written-code

1,0731 gold badge7 silver badges10 bronze badges

Collectives™ on Stack Overflow

Multiple OR conditions in Javascript Function

2 Answers 2

3 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related