¿Cómo borrar un valor seleccionado en el menú desplegable Selectize.js?

3 minutos de lectura

avatar de usuario
Pranav Singh

tengo un seleccionar.js menú desplegable y tengo que borrar el valor seleccionado.

He intentado esto (como se sugiere en otra pregunta):

var selectize = $("#optionNetFlow")[0].selectize;
selectize.clear();

Pero da el siguiente error:

ingrese la descripción de la imagen aquí

Cuando lo cambio a esto:

var selectize = $("#optionNetFlow").selectize;
selectize.clear();

Me da este error:

ingrese la descripción de la imagen aquí

¿Qué estoy haciendo mal aquí?

  • si revisas documentos mencionado en proporcionado incorrecto respuesta (imagínense: 9 votos positivos por respuesta incorrecta. Bueno, tal vez otra parte de la respuesta sea correcta, pero la primera línea de código es totalmente incorrecta): verá cómo debe hacerse.

    – Regente

    14 de noviembre de 2014 a las 5:55


  • Gracias @Regent, lo solucioné. Gracias por la ayuda.

    – Pranav Singh

    14 de noviembre de 2014 a las 6:00

  • Pasa algunas veces. A veces sin ninguna razón adecuada. Relájate. No es que tengas mala reputación, ¿sabes? Mi voto positivo puede compensar 2,5 votos negativos.

    – Regente

    25 de junio de 2015 a las 13:23


avatar de usuario
Pranav Singh

Finalmente encontré la respuesta aquí. Demostraciones de Selectize.js

Lo que funciona para mí es:

 var $select = $('#optionNetFlow').selectize();
 var control = $select[0].selectize;
 control.clear();

lo que me faltaba var $select = $('#optionNetFlow').selectize(); antes de aplicar la solución provista en la respuesta de la pregunta anterior.

Ahora debo obtener todas las funciones en la consola como:

ingrese la descripción de la imagen aquí

  • Esta solución también elimina el registro (borrar la lista desplegable). Ya no puede buscar en la lista.

    – khan

    25 de junio de 2019 a las 10:51

  • @khan No, no lo hace. Acabo de comprobar esta solución: funciona perfectamente. Todavía puedo buscar y seleccionar el elemento borrado. Versión utilizada para verificar esto: Selectize.js v0.12.4.

    – informatik01

    20 de febrero de 2020 a las 15:54

avatar de usuario
Keeno

Prueba esto,

$("#optionNetFlow")[0].selectize.clear();

  • Esta es la mejor manera, no tiene que almacenar la selección en una variable global al inicializar, simplemente llame a esto cuando lo necesite.

    – Mateus Viccari

    26 de enero de 2018 a las 15:29

  • La mejor respuesta. Y después de haber borrado la entrada, es posible que deba enfocarla para abrir la lista. Uso para eso: foco().

    – Gustavo

    21 oct 2018 a las 13:51

  • eso es genial, funciona para mí, acabo de agregar la identificación de mi cuadro de selección y boom, funcionó, muchas gracias

    – muhaymin khan

    20 de enero de 2021 a las 6:14

avatar de usuario
aditya singh

Probar esto:- http://jsfiddle.net/adiioo7/2gnq1ruv/204/

JS:-

jQuery(function ($) {
    var $select = $('#input-tags').selectize({
        persist: false,
        create: true
    });

    $("#btnClear").on("click", function () {
        var selectize = $select[0].selectize;
        selectize.clear();

    });
});

  • Gracias por la ayuda. Lo solucioné. +1 para jsfiddle.

    – Pranav Singh

    14 de noviembre de 2014 a las 6:06

  • ¿Qué hace persistir?

    – astroanu

    25 de marzo de 2016 a las 9:12

  • @astroanu: dice “¿mantener la opción después de que se haya deseleccionado o no?” como una bandera booleana, básicamente. La fuente es documentos de uso: github.com/selectize/selectize.js/blob/master/docs/usage.md

    – RoboBear

    2 de junio de 2017 a las 16:56


avatar de usuario
M4r

$(document).on('click', 'div.selectize-input div.item', function(e) {
    var select = $('#services').selectize();
    var selectSizeControl = select[0].selectize;
    // 1. Get the value
    var selectedValue = $(this).attr("data-value");
    // 2. Remove the option
    select[0].selectize.removeItem(selectedValue);
    // 3. Refresh the select
    select[0].selectize.refreshItems();
    select[0].selectize.refreshOptions();
});

Esto no elimina el elemento de la selección, solo lo elimina de las opciones seleccionadas.

  • +1 por esto! Pero solo una pregunta, ¿qué significa esta línea? element.selectize && element.selectize.clear()

    – Quer

    20 de septiembre de 2019 a las 10:17

  • Significa: si element.selectize no es nulo o indefinido, entonces bórrelo

    – Marca

    2 oct 2019 a las 22:35

O si tiene una selección múltiple y desea restaurar los elementos seleccionados en la lista desplegable (ocultar el conjunto seleccionado en verdadero).

var selectize = $("#select-item").selectize;
//clone array
var items = selectize.items.slice(0);
for (var i in items) {
    selectize.removeItem(items[i]);
}
selectize.refreshOptions();

¿Ha sido útil esta solución?