Django-autocomplete-light: on change event

[XaviP]

Hi, reporting that the jquery "change", "select2:select", "select2:change", etc... events are not working for me using 3.3.2 (jquery 3.3.1) In vanilla js, it works ok.

This is not working:

$("#myselect2id").on("change", function() { // or "select2:select" or "select2:change"...
  console.log("myselect2id changed");
});

This works:
```
document.querySelector('select[name="myselect2name"]').onchange=function() {
console.log("myselect2name changed");
};

[coredumperror]

Hmmm... Could that have something to do with the version of jquery that your own code uses being separate from the version that we use to install Select2 and DAL's js? I don't think that makes sense, but I'm not a JS guru.

Does the first code block work if you use DAL version 3.3.0?

[XaviP]

hi @coredumperror,

• I'm using django 2.1.1. In my templates I use the django admin jquery ({% static 'admin/js/vendor/jquery/jquery.js' %}), which I think is the same that uses django-autocomplete-light
• I've tried with DAL 3.3.0, but the first code block didn't work.
• I am not a JS guru either, so I don't know how to debug it.

[coredumperror]

Ah, if it doesn't work on 3.3.0 either, then your issue isn't with the changes I made, which got incorporated into 3.3.1 and 3.3.2. Unfortunately, I only joined the project team when I made those changes, so I'm not yet familiar with the codebase outside of that tiny sliver of code I wrote.

One thing that just came to mind though is that your jQuery codeblock is not quite identical to your raw Javascript code block. One selects #myselect2id, while the other selects select[name="myselect2name"]. Maybe the <select> element itself isn't the one that has the ID of myselect2id? If that ID is on a wrapper around the <select>, it would make sense for it to not get sent the "change" or "select2:select" or "select2:change" events.

[dwasyl]

@coredumperror I'm experiencing the same issue as @XaviP. None of the select2 events are binding. Didn't seem to be any better when I rolled back to 3.3.0 though.

Using the Dev Tools and checking for listeners, jQuery listeners in the main jQuery context seem to register (and then don't do anything), but jQuery listeners in the yl.jQuery context, don't get registered for fire.

[jpic]

@dwasyl do you think dal should get rid of yl.jQuery at all, and assume that the user will load a compatible version ? After all, it's not like jquery is going to have breaking updates imho ...

[dwasyl]

@jpic Just to follow up in both... yes definitely. I'd think it's safe to say that out of Django Admin users can be required to include jQuery themselves. Or some sort of enable/disable option on jQuery.

[jpic]

@dwasyl back in the past Django admin shipped old versions of jquery, so additional hacks were required to also have a modern jquery.

Those days are far behind, nowadays Django admin does ship a jquery version that is select2 compatible with select2 /because/ Django admin ships select2. In addition, it's not like jquery is going to have any new breaking release. As such, it looks like that supporting parallel versions is more bloating than useful nowadays.

[dima-kov]

The same bullshit.

@XaviP how did you fix the problem?

[jpic]

Dal is back to shipping select2 through a git submodule, if needed we can update it and issue a new release.

[nikijoe]

Use django-autocomplete-light 3.7.0.dev0. You can capture change event in jquery. But changing the selection with jquery is where the problem lies. $(selector).change(function() {
<--- your code here --->
}); works.

But $(selector).val(value).trigger('change'); not working. Looking for help for the same.