JavaScript, JQuery Problem: Function triggered automatically when page load!

Question

I'm a newbie in jQuery, so excuse me for asking such a simple question. I want to use jQuery Spin library and get notified when the value is changing. Here is my code:

<script>
$(document).ready(function(){
    $.spin.imageBasePath = './theme/css/images/spin1/';
    $('#spin1').spin({
        min: 1,
        max: 99,
        lock: true,
        beforeChange: calculate_price()
    });
});

function calculate_price() {
    $('#lblTotalPrice')[0].innerHTML = $('#spin1')[0].value;
}
</script>

It's very simple. But the problem is "calculate_price" function is triggered everytime page loaded and it did not trigger when user change the value of Spin Edit.

Does somebody have an idea why this is happening?

jfriend00 · Accepted Answer · 2011-07-23 08:52:53Z

4

I'm not familiar with that particular library, but if you have everything else right, then you need to change this:

beforeChange: calculate_price()

to this:

beforeChange: calculate_price

You were setting beforeChange to the return result from calling calculate_price(), not to the function itself. Thus, it was called once upon initial assignment and not during spin.

Looking at the documentation for the beforeChange callback, you will be getting called before the value actually changes. That callback is called with two parameters, the old and new value so you might want to add those to your calculate_price(newVal, oldVal) function and use them rather than obtaining the value from the spin control.

edited Jul 23, 2011 at 8:52

answered Jul 23, 2011 at 8:47

jfriend00

711k104 gold badges1.1k silver badges1k bronze badges

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

Comments

Sergey Metlov · Accepted Answer · 2011-07-23 08:51:37Z

1

You should change calculate_price() to calculate_price in spin() method options. The matter is you tried to set to beforeChange field the result of executing calculate_price function. That is why it is called every time on page loaded. You need to set function as callback, so, do not put () after function name.

answered Jul 23, 2011 at 8:51

Sergey Metlov

26.5k28 gold badges97 silver badges154 bronze badges

Collectives™ on Stack Overflow

JavaScript, JQuery Problem: Function triggered automatically when page load!

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related