How to capture on change event on Django Autocomplete Light widget using jQuery

Question

I am using Django Autocomplete Light (DAL) in my application.

In order to do some post-processing in the background on user selection, I am trying to capture the .on('change') event (when DAL select field choice is changed) using jQuery (like we do on objects like an input field or a Django select field etc.). However I am not able to capture the event.

For example the following code ( edited ):

$(document).on('change', '#x_select_item', function() {
    console.log('Selection on x_select_item changed');
});

is not generating any message .

Edit

The following code for capturing .on('focus) is working :

$(document).on("focus", '#x_select_item', function() {
    console.log('THIS IS FIELD x_select_item for on Focus Event');
});

Looking for DAL events also did not help much excepting that it takes one to the "select2" events page . There are events listed including "change" and "change.select2", but using both of these (as in example above) are not generating any reaction in the console.

Is there some way selection change event may be captured on DAL ?

Answer 1

This is quite an "older" question, but I just stumbled about nearly the same problem.

As I found out, there was a bug in older versions of DAL Django Autocomplete Light. According to the issues in the github project it's fixed in versions >3.5

I've just upgraded to the latest version (v3.8.1) and change events are firing as expected.

Answer 2

I have installed version 3.8.1 and i have to use this code for the change event to fired, is in the documentation:

$(':input[name$=continent]').on('change', function() {
   console.log("change fired");
});

where continent is the model field name, not the id of the select when you inspect the element in the html code.