Select2“更改”事件不会触发 htmx答案

【问题标题】：Select2 "change" event does not trigger htmxSelect2“更改”事件不会触发 htmx
【发布时间】：2021-04-15 21:33:31
【问题描述】：

这是我想要的方式：如果<select> 被更改，那么htmx 被触发。

<script src="https://unpkg.com/htmx.org@1.1.0"></script>

<table>
 <tr hx-post="//example.com" hx-trigger="change">
  <td>
    <select name="runner">
     <option value="a">a</option>
     <option value="b">b</option>
    </select>
  </td>
 </tr>
</table>

如果我使用 django-autocomplete-light 小部件，则它不起作用。

我使用这个版本：django-autocomplete-light==3.8.1

【问题讨论】：

你能添加“select”作为hx-trigger以及改变吗？

标签： javascript autocomplete htmx

【解决方案1】：

刚刚遇到同样的问题，并使用以下 guettli 答案的修改版本修复它。

window.addEventListener("DOMContentLoaded", (e) => {
    $('select').on('select2:select', function (e) {
        $(this).closest('select').get(0).dispatchEvent(new Event('change'));
    });
});

【讨论】：

【解决方案2】：

如果我添加这个 JS，那么它就可以工作。欢迎提供更好的解决方案。

<script>
 window.addEventListener("DOMContentLoaded", (e) => {
  $('select').on('select2:select', function (e) {
   $(this).closest('tr').get(0).dispatchEvent(new Event('change'));
});
 })
</script>

【讨论】：