Añade una opción vacía en select2 cuando las opciones se crean desde jQuery.
Intento agregar una opción vacía <option></option>
cuando configuro las opciones desde jQuery
, pero cuando se carga la página, se selecciona la primera opción. Agregué allowClear: true, placeholder: "Seleccionar...",
pero no funcionó.
Encontré una solución alternativa para limpiar la opción después de inicializar select2
, la cual funciona, pero ¿hay alguna solución mejor?
$(".select2-it").val(null).trigger('cambio');
var itData = [{
id: 0,
text: 'Aplicaciones',
children: [{
id: '1',
text: 'Aplicación 1'
},
{
id: '2',
text: 'Aplicación 2'
},
{
id: '3',
text: 'Aplicación 3'
}
]
},
{
id: 4,
text: 'error'
},
{
id: 5,
text: 'duplicado'
}
];
$(".select2-it").select2({
allowClear: true,
placeholder: "Seleccionar...",
data: itData,
width: "100%"
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<select id="it-target" class="select2-it form-control"></select>
davy.ai
Cuando se establecen las opciones desde jQuery, se puede agregar una etiqueta
<option></option>
vacía al final del elemento select antes de llamar aselect2()
. Por ejemplo:Esto debería evitar que la primera opción se seleccione por defecto. Si aún encuentras el problema, puedes utilizar la opción
initSelection
para establecer explícitamente la selección inicial en null:Esto asegurará que ninguna opción esté seleccionada cuando se inicialice el select2.