Malcolm
Malcolm

Reputation: 12874

Jquery - change event firing on page load

I have select controls on a HTML page and using Jquery to set change event.

But the event fires on the page load and does not fire when I try to change values in the select controls.

Any ideas why?

$(function() {
    $('select[id^=Start], select[id^=Finish], select[id^=Lunch]').change(CalculateHours($(this)));
});

Upvotes: 3

Views: 5207

Answers (2)

jrotello
jrotello

Reputation: 4601

You are attempting to bind the result of CalculateHours to tthe change event. Try this instead.

$(function() {
    $('select[id^=Start], select[id^=Finish], select[id^=Lunch]').change(function() { 
        CalculateHours($(this)); 
    });
});

Upvotes: 2

SLaks
SLaks

Reputation: 888303

Your syntax is wrong.

By writing change(CalculateHours($(this)), you are calling the CalculateHours function and passing its return value to jQuery's change method as if it were a function. You would only write this if your function returned another function and you wanted to addd the returned function as an event handler.

You need to write .change(function() { CalculateHours($(this)); })

Upvotes: 12

Related Questions