jQuery表单转发器和select2不能一起使用

Question

我正在使用Select2和jQuery表单转发器(https://github.com/DubFriend/jquery.repeater)

我已经在google/so上搜索了2天，但似乎不能正常工作。

include jquery/select2.js/jquery.repeater.js

var form = $('#form');
form.find('select').select2();

form.repeater({
    show: function () {
    $(this).show(function(){
        form.find('select').select2('destroy').select2();
    });
    },
    hide: function (remove) {
      $(this).hide(remove);
    }
});

问题是，当select2已经初始化并且已经更改了DOM时，jQuery.repeater克隆了输入和选择元素所在的div标记，因此jQuery.repeater复制了更改后的DOM。我试图在调用repeat操作之前销毁select2，但这也不起作用。

Answer 1

我正在做一个项目，在这个项目中，我使用jQuery.repeater重复多个select2输入。下面的方法帮助解决了我在加载输入后初始化输入的问题。

$('.job_repeater').repeater({
  show: function () {
    $(this).slideDown();
    $('.select2-container').remove();
    $('Replace with your select identifier id,class,etc.').select2({
      placeholder: "Placeholder text",
      allowClear: true
    });
    $('.select2-container').css('width','100%');
  },
  hide: function (remove) {
    if(confirm('Confirm Question')) {
      $(this).slideUp(remove);
    }
  }
});

更精确的jQuery选择器将有助于仅移除/初始化您想要的选择。

在初始化select2之后，我总是使用CSS行来调整父div/容器的宽度。

诚挚的问候

Answer 2

尝尝这个

include jquery/select2.js/jquery.repeater.js

var form = $('#form');
form.find('select').select2();

form.repeater({
    show: function () {
    $(this).show(function(){
        // you have not really created this second one
        // so the destroy does not work.
        // Since it is just a copy of the html,
        form.find('select').next('.select2-container').remove();
        form.find('select').select2();
    });
    },
    hide: function (remove) {
      $(this).hide(remove);
    }
});

Answer 3

这是一个在表单中继器按钮时钟上初始化select2的解决方案。

<script type="text/javascript">

 

    $("p").mouseover(function(){

        setTimeout(function(){

 

            $(".select2").select2({

                placeholder: "Select a state",

                allowClear: true

            }); 

                  

        }, 100);

    }); 

 

</script>

有关问题和解决方案的深入概述，请参阅see here