Evento di modifica evento di selezione select2 dinamico

Question

Ho un modulo con un paio di selezioni all'interno. sto applicando il plugin jQuery select2 su quelle seleziona come questo:

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

del select bel lavoro, ma devo questo codice per autosubmit mia forma (ho la classe autosubmit sul tag form).

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 = ""; 
      }); 
     } 
    }); 

Il fatto è che con select2, il cambiamento o l'evento di messa a fuoco non viene eseguito affatto. Se rimuovo select2, gli eventi vengono sparati perfettamente.

Cosa sto sbagliando?

Answer 1

Select2 ha solo 2 eventi, open e change (http://select2.github.io/select2/#events), è possibile aggiungere solo gli ascoltatori a loro. È possibile utilizzare l'evento open anziché focus per l'elemento <select>. E per favore non usare il metodo live(), poiché è deprecato. Utilizzare invece on().

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 = ""; 
     }); 
    } 
}); 

Ecco il Fiddle