Initialize onchange event inside a loop - Javascript

Question

I'm trying to bind an onChange event to 7 dropdowns inside a loop. But when any of dropdown changes, the onChange event for the last one is always executed.

$(function () {
    for (var i = 1; i <= 7; i++) {
        $('select[id$="bodysys' + i + '"]').change(function () {
            if (this.value == "99")
                enabletextbox($('input[id$="bodysys' + i + 'spec"]')[0]);
        });
    }
}

How to make onChange work for all elements separately?

callumacrae · Accepted Answer · 2012-03-21 13:04:08Z

7

This is called the last one only problem, and is solved using a closure:

$(function () {
    for (var i = 1; i <= 7; i++) {
        (function (i) {
            $('select[id$="bodysys' + i + '"]').change(function () {
                if (this.value == "99")
                    enabletextbox($('input[id$="bodysys' + i + 'spec"]')[0]);
            });
        })(i);
    }
}

It creates a new scope, so when i is changed in the original scope, it will not be changed in the old scope.

answered Mar 21, 2012 at 13:04

callumacrae

8,45310 gold badges34 silver badges50 bronze badges

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

Comments

etlds · Accepted Answer · 2012-07-17 17:04:53Z

0

$('select[id*="bodysys"]').each(function (index) {
        $(this).change(function () {
            if ($("option:selected", this).val() == "99")
                enabletext($('input[id$="bodysys' + (index + 1) + 'spec"]')[0]);
        });
    });

This way works too.

answered Jul 17, 2012 at 17:04

etlds

5,9102 gold badges25 silver badges31 bronze badges

Collectives™ on Stack Overflow

Initialize onchange event inside a loop - Javascript

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