JQuery, bind same function to 3 different textbox's keyup event

Question

I have 3 textboxes and on the keyup event for all the 3 I want to call the same function?

In the below code, I am tring to bind 'keyup' event to 'CalculateTotalOnKeyUpEvent' function to textbox named 'compensation', but it doesn't work

$("#compensation")   
      .bind("keyup",CalculateTotalOnKeyUpEvent(keyupEvent));

function CalculateTotalOnKeyUpEvent(keyupEvent) {
        var keyCode = keyupEvent.keyCode;
        if (KeyStrokeAllowdToCalculateRefund(keyCode)) {
            CalculateTotalRefund();
        }
    };

Thanks..

Answer 1

You need do like this:

// edit according to request in the comment 
// in order to select more than one element you need to specify id's comma separated
// as well may be you need to consider to use class for selected elements
// then it could be just $(".className")

    $("#element1, #element2, element3, ....")  
          .bind("keyup",CalculateTotalOnKeyUpEvent);

You need to pass function as parameter you do not need to pass the function as it was declared.

Answer 2

$("#txt1, #txt2, #txt3").keyup(fn);

Answer 3

You are calling CalculateTotalOnKeyUpEvent immediately, not passing it as an argument. Try:

$("#compensation").bind("keyup",CalculateTotalOnKeyUpEvent);

Answer 4

$("#compensation").bind("keyup",CalculateTotalOnKeyUpEvent(keyupEvent));

When you write CalculateTotalOnKeyUpEvent(keyUpEvent) [notice the () after function name], you are executing the CalculateTotalOnKeyUpEvent and assigning the result of the function to the key up event.

You should do something like,

$('#compensation, #otherId1, #otherId2')
    .bind('keyup', CalculateTotalOnKeyUpEvent);

Where 'otherId1' and 'otherId2' are the ids of two more textboxes.

Answer 5

or just give all 3 text boxes the same class and you good to go