CODEWITHSUNDEEP
javascriptjqueryselectize.js
John
John

Reputation: 708

How to remove an item from Selectize?

Is there any way I can remove an item from Selectize?

Here is my a sample list:

  1. AMNT
  2. QTY
  3. NA

When I pass NA it should remove particular item:

   $.fn.removeSelectorValue = function (value) {
      var selectize = this[0].selectize;
      selectize.removeItem(value);

      return this;
   };

This is not working. Can anyone help me with this?

Upvotes: 11

Views: 28121

Answers (4)

M4r
M4r

Reputation: 381

$(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);

    select[0].selectize.refreshItems();
    select[0].selectize.refreshOptions();

});

This code do not remove the item from the select, just remove it from the selected options.

Upvotes: 8

Andy Jarrett
Andy Jarrett

Reputation: 873

I'm late to the party but the other methods didn't work for me, I don't know if its because I was pulling in a list from a remote source?

In short there are 2 steps:

  1. Get the value of the selected item
  2. Remove that item

You can obviously make this code smaller but i've left it verbose for readability

var $select = $('#users').selectize(); 
var selectSizeControl = $select[0].selectize; 
// 1. Get the value
var selectedValue = selectSizeControl.getValue()
// 2. Remove the option 
selectSizeControl.removeOption( selectedValue )

Upvotes: 4

Tom Goldenberg
Tom Goldenberg

Reputation: 566

Was recently implementing this, and if you remove the last item, the input looks buggy (as mentioned above). A workaround (kind of hackish) is in the onItemRemove function, find the length of saved items, and if length == 0, use jQuery to fix the input - $('.selectize-input').css({'height':'35px'});

Upvotes: 0

Michał Samujło
Michał Samujło

Reputation: 368

removeItem removes selected item identified by given value. To remove option from the list you should use removeOption

Example - open http://brianreavis.github.io/selectize.js/, open console and enter:

$('#select-beast')[0].selectize.removeOption(1)

to remove Chuck Tesla from available options

Upvotes: 11

Related Questions