jquery - check - select2 dinamico

Evento de cambio dinámico select2 no encendido

Question

Tengo un formulario con un par de selects adentro. Estoy aplicando el plugin select2 jquery sobre las selecciones como esta:

$("select.company_select, select.positions_select").select2();

La selección funciona bien, pero tengo este código para enviar automáticamente mi formulario (tengo la clase autosubmit en la etiqueta del formulario).

var currentData;
    $(''.autosubmit input, .autosubmit select, .autosubmit textarea'').live(''focus'', function () {
        currentData = $(this).val();
    });

    $(''.autosubmit input, .autosubmit select, .autosubmit textarea'').live(''change'', function () {
        console.log(''autosubmiting...'');
        var $this = $(this);
        if (!currentData || currentData != $this.val()) {
            $($this.get(0).form).ajaxSubmit(function (response, status, xhr, $form) {
                currentData = "";
            });
        }
    });

El problema es que con select2, el cambio o el evento de enfoque no se dispara en absoluto. Si elimino el select2, los eventos se disparan perfectamente.

¿Qué estoy haciendo mal?

Answer 1

Select2 solo tiene 2 eventos, open y change ( http://select2.github.io/select2/#events ), solo puede agregar oyentes. Puede usar evento open lugar de focus para el elemento <select> . Y no use el método live() , ya que está en desuso. Use on() lugar.

var currentData;
$(".autosubmit select").on("open", function() {
    currentData = $(this).val();
});
$(".autosubmit input").on("focus", function() {
    currentData = $(this).val();
});
$(".autosubmit input, .autosubmit select").on("change", function() {
    var $this = $(this);
    console.log(''autosubmitting'');
    if (!currentData || currentData != $this.val()) {
        $($this.get(0).form).ajaxSubmit(function (response, status, xhr, $form) {
            currentData = "";
        });
    }
});

Aquí está el Fiddle