在 bootstrap 模态中初始化 select2

Question

当我第一次打开模式选择 2 时，日期选择器小部件被正确初始化。然后，我使用 $('#myModal').html(data) 将模态内容替换为其他 HTML，在此阶段，小部件未初始化。

运行 .datepicker() 在它的 DOM 元素上解决了问题，但是运行 .select2() 在它的输入元素上有和没有选项不起作用。

任何帮助将不胜感激。谢谢

Answer 1

只需在加载模式事件中初始化日期选择器或其他东西即可：

$('#myModal').on('shown.bs.modal', function () {
    $('#myInput').datepicker();
  })

Answer 2

我找到了解决方案，但有点奇怪。模态框内的 HTML 被替换为：

$('.modal-content').html(html);

它在视觉上有效，我可以在模式中看到新内容，但小部件未初始化。将此调用更改为：

$('#ajax-modal-lg').find('.modal-content').html(html);

解决问题。

Init select2 inside bootstrap modal