Django - select onchange event not working anymore if using jquery-editable-select

Question

I'm using a select item from a django model with a onchange event to trig a JS script :

forms.py

class forms_bdc(forms.ModelForm):

  [...]
    bdc_description_1 = forms.ModelChoiceField(queryset=models_products.objects.values_list('product_denomination', flat=True),required=False, widget=forms.Select(attrs={'id': 'editable-select-2','onchange': 'populate_selected_product(this.id,this.value)'}),empty_label=None )

It works very well but if I'm using jquery-editable-select to transform my select item in sort of a searchable datalist, the onchange event does not trig the JS script anymore ...

Anybody knows a workaround for this ?

template.html:

<script>

function populate_selected_product(product_selectbox_id, product_selectbox_value) {
            
    $.ajaxSetup({
        data: {
            product_num: product_selectbox_value,
            csrfmiddlewaretoken: '{{ csrf_token }}'
        },
    });
    $.ajax({
        type: "GET",
        url: "../populate_selected_product/", 
        success: function (data) {
            $("#div_update_row_bdc_product").html(data)
            $('#'+product_selectbox_id).parent().find('#id_id_bdc').val($("#id_product_denomination").val())
            
        }
    });
}
    
// and here is the code to transform the select item with jquery-editable-select
$('#editable-select-2').editableSelect({effects: 'fade'});

</script>

Answer 1

I finally found how to do thanks to this link : https://indrimuska.github.io/jquery-editable-select/

In my example here is what I did :

$('#editable-select-2').editableSelect().on('select.editable-select',
            function (e, li) {
            populate_selected_product($('#editable-select-2').attr('id'),li.text())
        });