Dynamisches select2 nicht feuern change Ereignis

Question

Ich habe ein Formular mit ein paar Selects innerhalb. ich das select2 jQuery-Plugin über diesen wählt wie diese Anwendung:

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

Die ausgewählten Arbeiten in Ordnung, aber ich habe diesen Code meine Form autosubmit (Ich habe das autosubmit Klasse auf dem Formular-Tag).

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

Die Sache ist, dass mit der Auswahl2, die Änderung oder das Fokusereignis überhaupt nicht ausgelöst wird. Wenn ich select2 entferne, werden die Ereignisse perfekt ausgelöst.

Was mache ich falsch?

Answer 1

Select2 nur 2 Ereignisse hat, open und change (http://select2.github.io/select2/#events), sind Sie in der Lage Zuhörer sie nur hinzuzufügen. Sie können open Ereignis statt focus für <select> Element verwenden. Und bitte verwenden Sie nicht live() Methode, wie es veraltet ist. Verwenden Sie stattdessen 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 = ""; 
     }); 
    } 
}); 

Hier ist die Fiddle