2

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);
    }
});

問題は、jQuery.repeater が、select2 が既に初期化されていて DOM が既に変更されている場合に、input 要素と select 要素がある div タグを複製するため、jQuery.repeater は変更された DOM をコピーすることです。繰り返しアクションが呼び出される前にselect2を破棄しようとしましたが、どちらも機能しません。

4

11 に答える 11

0

最初にドキュメントの準備ができたときに元の select2 を初期化し、次にリピーターの show メソッドで繰り返される selected2 要素の各インスタンスを $this でターゲットにすることで解決しました。たとえば、単純な選択ドロップダウンと複数選択がある場合、コードは次のようになります。

$(document).ready(function () {
  $(".select2").select2({
       placeholder: "Select a state",
       allowClear: true
    });
});

$('.repeater').repeater({

        show: function () {
            $(this).slideDown();
            $(this).find('.select2-multiple').select2({

                placeholder: "Select Title",

                allowClear: true,

            });
            $(this).find('.select2').select2({

                placeholder: "Select Title",

                allowClear: true,

            });


        },
        hide: function (deleteElement) {
            if (confirm('Are you sure you want to delete this element?')) {
                $(this).slideUp(deleteElement);
            }
        }
    });
于 2018-04-10T14:27:34.460 に答える