How to deselect select input with jquery?

Question

I use this link for select option in my HTML pages(select2 in below).

My cod exist in JSFiddle too. I want deselect all with JQuery. I use so many code but not working for this option.

var elements = document.getElementById("field2").selectedOptions;

    for(var i = 0; i < elements.length; i++){
      elements[i].selected = false;
    }

or

document.getElementById("field2").value = "";

or

$('#field2').find($('option')).attr('selected',false)

freedomn-m · Answer

With the specific plugin you're using, you can clear the selection with

$("#id").val("");

and you can reset the wrapper using

$("#id")[0].loadOptions()

([0] as it's a js function added by the wrapper)

Updated snippet:

$("#clearBtn").click(() => {
  $("#field2").val("");
  $("#field2")[0].loadOptions();
});

select {
  width: 20em;
}








  
    
      Select 2

How to deselect select input with jquery?

1 Answers