Resetting Select2 value in dropdown with reset button

Question

What would be the best way to reset the selected item to default? I\'m using Select2 library and when using a normal button type=\"reset\", the value i

Answer 1

to remove all option value

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

Answer 2

I'd try something like this:

$(function(){
    $("#searchclear").click(function(){
        $("#d").select2('val', 'All');
    });
});

Answer 3

You can also reset select2 value using

$(function() {
  $('#d').select2('data', null)
})

alternately you can pass 'allowClear': true when calling select2 and it will have an X button to reset its value.

Answer 4

The best way of doing it is:

$('#e1.select2-offscreen').empty(); //#e1 : select 2 ID
$('#e1').append(new Option()); // to add the placeholder and the allow clear

Answer 5

For me it works only with any of these solutions

$(this).select2('val', null);

or

$(this).select2('val', '');

Answer 6

Select2 uses a specific CSS class, so an easy way to reset it is:

$('.select2-container').select2('val', '');

And you have the advantage of if you have multiple Select2 at the same form, all them will be reseted with this single command.