Detectar evento "onchange" en lista desplegable

[majete]

Iniciado por Alexis88

El punto es que, si realizas el cambio desde el código, se omite la interacción con el DOM, por lo que evidentemente esos eventos no se ejecutarán. Por eso es que te sugiero que, en el bloque de código en el que realizas la asignación de del dato, ejecutes las acciones que deseas. Si no quieres repetir líneas de código, puedes tener todo en una función a la cual solo tendrías que llamar.

Un ejemplo:

Código HTML:

<select id="foo">...</select>
<input type="text" id="bar" />
 

Código Javascript:

//La función a ejecutarse
function ejemplo(){
    alert("Ocurrió un cambio");
}
 
//Si se producen estos eventos en los elementos del DOM, se ejecutará la función "ejemplo"
$("#foo").on("change", ejemplo);
$("#bar").on("keydown change", ejemplo);
 
//Si hago el cambio de valor desde el código, también se ejecutará la función "ejemplo"
$("#foo").val("abc");
ejemplo();
 
$("#bar").val("def");
ejemplo();
 

Exactamente es lo que me comentas... al realizar el cambio desde código, no llega la interacción al DOM y el evento no se ejecuta. Me es imposible saber qué es lo que le tengo que meter a la función, porque el JS que hay ahora (formeter.js) me resulta muy complicado de entender. Empieza así:

Código Javascript:

(function ($) {
    $.fn.extend({
        formProgress: function (options) {
            var st = {
                speed: 300,
                style: 'green',
                bubble: false,
                selector: '.required',
                minPercent: 30,
                message: 'Please complete all required fields !'
            };
            if (options) {
                $.extend(st, options);
            }
            var _this = $(this),
                sel = st.selector,
                mainForm = $(sel).parents('form'),
                names = [],
                timer;
 
            $(sel + ":radio").each(function () {
                var n = $(this).attr('name');
                if ($.inArray(n, names) < 0) {
                    names.push(n);
                }
            });
 
            var totalInputs = $(sel).not(":radio").length + names.length;
 
            $(mainForm).find(sel + ':checkbox, ' + sel + ':radio, select' + sel).on('change', function () {
                animateBar.call(_this);
            });
            $(mainForm).find('input[type=text]' + sel + ', input[type=password]' + sel + ', textarea' + sel + ', input[type=hidden]' + sel + ',  input[type=email]' + sel + ', input[type=tel]' + sel).on('keydown', function () {
                timer && clearTimeout(timer);
                timer = setTimeout(function () {
                    animateBar.call(_this);
                }, 300);
            });
...
 

Los cambios en los campos de formulario se ejecutan en los "onchange" u "onkeydown"...