clearOptions should not clear items

The clearOptions() method results in the clear() method also being called. Given the logical distinction between "options" and "items" this seems incorrect. The behavior also prevents (unless I'm missing another approach) the use case of providing a new set of options for each item, as follows:
$('#select-state').selectize({
load: function(query, callback){
this.clearOptions();
//fetch the new options
}
});

But couldn't your fix clear the input-field if the query was really fast or really slow?
I use the onType to clear the query cache. And more or less the same code for onClear and onItemRemove.
This code is for an older version of selectize, so you might not need all the lines anymore and could probably be optimized even more.

$('#select-state').selectize({
    onType: function(){
        ajaxquery && ajaxquery.abort();
        this.$input[0].selectize.renderCache = {};
        this.$input[0].selectize.clearOptions();
        this.$input[0].selectize.refreshOptions(true);
    },
    load: function(query, callback) {
        if (!query.length) return callback();
        ajaxquery && ajaxquery.abort();
        ajaxquery = $.ajax({
            url: '/?q=' + encodeURIComponent(query),
            type: 'GET',
            dataType: 'json',
            error: function() {
                callback();
            },
            success: function(res) {
                callback(res);
            }
        });
    }
});

This is nonsense why it's still open. You should just remove .clear() at the end of the function and it just works as expected.

@caseymct

According to this changelog:
Fixed bug making clearOptions function. Now it doesn't remove already selected options.

(thanks @caseymct - #1079)

But it doesn't seem to work.
Also, silent is implemented and doesn't see to work too.

I can confirm for silent. Not working for add item

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this will be closed in 5 days

This is wrong proposition. clearOptions must call clear otherwise data will be inconsistent.

For example you have list 1,2, user selected 7. Is this expected? No, because there is no 7 on the list.
Same with clearOptions. If options are cleared, you can choose nothing, thus selected list also must be cleared.

Imho, this is bad design - method is called clearOptions and that is exactly what is expected from the method to do.
It shouldn't delete any already selected items.

For example in my case - I need to delete all options all the time, because I am calling backend with every pressed letter on keyboard. Then user selects what they need and I close options and delete them - ready for next query. When they select everything they need, they submit results with button. In version 0.12.6 this worked quite well.

This is nonsense why it's still open. You should just remove .clear() at the end of the function and it just works as expected.

Its true what he said, remove the clear and use it like this example:

it works like butter 👍

// Functie om gebruikers op te halen en dropdown te vullen met behulp van Selectize
function loadUsers(selectedEmails = []) {
Fliplet.DataSources.connect(usersDataSourceId)
.then(connection => connection.find())
.then(users => {
if (!users.length) {
console.warn('Geen gebruikers gevonden.');
return;
}

  const emailSelect = document.getElementById("emailSelect");
  
  // Controleer of Selectize al is geïnitialiseerd en haal de controle op
  let selectizeControl = $(emailSelect)[0].selectize;
  
  if (selectizeControl) {
    // Als Selectize al bestaat, maak dan de huidige selectie leeg
    selectizeControl.clear(); // Wis de geselecteerde items zonder de opties te wissen
  } else {
    // Initialiseer Selectize als het nog niet bestaat
    $(emailSelect).selectize({
      plugins: ['remove_button'],
      delimiter: ',',
      persist: false,
      create: false,
      sortField: 'text'
    });
    
    // Haal nu de selectize instance op
    selectizeControl = $(emailSelect)[0].selectize;
  }

  // Voeg opties toe aan de select dropdown
  selectizeControl.clearOptions(); // Zorg ervoor dat er geen dubbele opties komen te staan
  users.forEach(user => {
    if (user.data && user.data.Email && user.data.Email.trim() !== "") {
      selectizeControl.addOption({
        value: user.data.Email,
        text: user.data.Email
      });
    }
  });

  console.log('Gebruikers succesvol geladen en dropdown bijgewerkt met Selectize.');
  
  // Selecteer bestaande e-mails indien aanwezig
  if (selectedEmails.length > 0) {
    selectedEmails.forEach(email => {
      selectizeControl.addItem(email);
    });
  }
})
.catch(error => {
  console.error('Fout bij het laden van gebruikers:', error);
});

}

Due to a merge conflict between two incompatible feature requests, we now have the worst of both worlds: clearOptions() specifically does not remove currently-selected options; but does clear the selection. See #2146 for a more complete explanation.

here is how i worked around this issue

edit: in my humble opinion there should absolutely be an option to keep all selected items but clear all options which are not selected

// do not use clearOptions here, as it also clears all selected items..
// also: currently there is a bug and clearOptions does not remove the options, but all selected items
//this.clearOptions();

// list of options to keep because they are selected
var optionsToKeep = [];
this.items.forEach((item) => {
	optionsToKeep.push(this.options[item]);
});

// list of options to remove
var optionsToRemove = [];
for (var [key, value] of Object.entries(this.options)) {
	if (!optionsToKeep.includes(value)){
		optionsToRemove.push(value);
	}
}

// remove options
optionsToRemove.forEach((option) => {
	this.removeOption(option.value, true);
});

Navigation Menu

Repository navigation

clearOptions should not clear items #593

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

clearOptions should not clear items #593

Description

Activity

flamber commented on Nov 3, 2014

dresende commented on Sep 25, 2018

jicihome commented on Dec 30, 2020

jicihome commented on Mar 30, 2021

github-actions commented on Jun 29, 2021

KES777 commented on Jun 21, 2023

suchoss commented on Jul 12, 2024

jthakilla9 commented on Oct 25, 2024

dvg-p4 commented on Nov 12, 2024

kunibertgangnam commented on May 30, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions