Question

我试图在我的select2组件上显示一些信息，但它不能100％工作。

经过几个小时的搜索，我做到了：

    <div class="row">
        <div class="col-md-12">
            {!! Form::label('lblRequisitos', 'Selecione os Requisitos') !!}
            {!! Form::select('requisitos[]', $requisitosVaga, null, ['id'=>'requisito', 'class'=>'form-control js-states', 'multiple' => 'multiple']) !!}
        </div>
    </div>

@push('scripts')
<script>
    $(function()
    {
        $('#requisito').select2(
        {
            placeholder: "Escolha a habilidade...",
            minimumInputLength: 2,
            ajax:
            {
                url: '{{route('pesquisa-habilidade')}}',
                dataType: 'json',
                data: function (params)
                {
                    return {q: $.trim(params.term)};
                },
                processResults: function (data) {
                    return {
                        results: data
                    };
                },
                cache: true
            },
            initSelection : function (element, callback) {
                var data = [];
                $(element).find("option").each(function () {
                    data.push({id: $(this).val(), text: $(this).text()});
                });
                callback(data);
            }
        });
    });
</script>
@endpush

有了它，初始加载就可以了。但是当我尝试搜索下一个值时（当我尝试编辑时），它会清除所有选项。

Answer 1

也许这不是最好的解决方案，但我解决了。

仅添加以下行：

//.... At select2 function ...

initSelection : function (element, callback) {
            var data = [];
            $(element).find("option").each(function () {
                data.push({id: $(this).val(), text: $(this).text()});

                // ADD this line to put the option selected
                $(this).prop('selected', true); 
            });
            callback(data);
        }
// ....

现在，它正在100％工作。

任何人都有更好的解决方案吗？

Select2＆amp; Ajax - 使用select2 + ajax + multiple选项加载值

1 个答案: