javascript - ¿Podemos usar select2 dentro del diálogo?

Estoy trabajando en asp.net core. Estoy usando TypeScript. Estoy usando Select2.

HTML:-

<select multiple id="e1" class="js-example-basic-multiple js-states form-control">
    <option value="AL">Alabama</option>
    <option value="Am">Amalapuram</option>
    <option value="An">Anakapalli</option>
    <option value="Ak">Akkayapalem</option>
    <option value="WY">Wyoming</option>
</select>

Guion:-

<script>
    $(document).ready(function () {
        $(".js-example-basic-multiple").select2();
    });
</script>

css y js:-

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

Este es mi código para select2. Estoy usando select2 dentro del cuadro de diálogo modal. Cuando uso select2 dentro del diálogo, no funciona.

Verifico que al usar select2 fuera del cuadro de diálogo modal, funciona bien.

¿Podemos usar select2 dentro del cuadro de diálogo modal? Si es así, ¿cómo?

Versión de select2: 4.0.3

Respuesta #1

También funciona bien dentro del modal. (revisa el fragmento)

$(document).ready(function() {
  $(".js-example-basic-multiple").select2();

  $("#dialog").dialog();
});

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>


<div id="dialog" title="Basic dialog">
  <select multiple id="e1" class="js-example-basic-multiple js-states form-control">
 
  <option value="AL">Alabama</option>
  <option value="Am">Amalapuram</option>
  <option value="An">Anakapalli</option>
  <option value="Ak">Akkayapalem</option>
  <option value="WY">Wyoming</option>
  </select>
</div>