Select2 does not work on adminLte + Laravel 5.8

I added a Select2 on the page, but it doesn't load at all. Has anyone been through this?

I implemented like this:

Page: register.blade.php 

<div class="box-body">
       <div class="col-md-12">
           <label for="Disciplinas">Disciplinas da Matriz Curricular</label>
                 <select class="js-example-basic-multiple" name="disciplinas[]" id="disciplinas" multiple="multiple">
                      @foreach($disciplinas as $disciplina)
                      <option value="{{ $disciplina->id_disciplina }}"> 
                               {{ $disciplina->nome }}</option>
                      @endforeach
                 </select>
        </div>
    </div>

    <script>
       $(function() {
           $('.js-example-basic-multiple').select2({
           placeholder: 'selecione'
           });
       });
   </script>

In the configuration file of AdminLte ta like this: 

[
            'name' => 'Select2',
            'active' => true,
            'files' => [
                [
                    'type' => 'js',
                    'asset' => false,
                    'location' => '//cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js',
                ],
                [
                    'type' => 'css',
                    'asset' => false,
                    'location' => '//cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css',
                ],
            ],
        ],

Only loads as a textarea. It does not apply the style and does not let you select more than one.

Author: Edward Ramos, 2019-10-08
Source

2 answers

Basically just put the referents .css and js, and with the example below: 

$(document).ready(function() {
  $('.select2-single').select2({
    placeholder: 'Selecione os itens',
    width: '100%'
  });
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css"/>    
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/css/select2.min.css" rel="stylesheet" />
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/select2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.10/js/i18n/pt-BR.js"></script>


<select class="form-control select2-single" multiple>
  <option>Item 1</option>
  <option>Item 2</option>
  <option>Item 3</option>
  <option>Item 4</option>
</select>

I am finding that it is missing to put select2.min.css and select2.min.js.

 0
Author: novic, 2019-10-08 17:46:08

This happens directly to me, one way Q works with me is to add the cdn call in the html head and add this js on the page q will have the select.

$("select.select-menu-color").select2({
    allowClear: true
});

And this is my html, it has attribute in .NET, but it's just fitting 

<select asp-for="estoque.LinhaId" class="select-menu-color bg-grey" asp-items="@(new SelectList(Model.Linhas,"Id","Nome","Descricao"))"></select>
 0
Author: Renan, 2019-10-08 17:33:46