Disable dropdown opening on select2 clear

Question

Seems that select2 4 opens by default the dropdown when clearing the current selected item. Previous versions of select2 didn't seem to have that behaviour and I'm trying to achieve it but no luck for now.

Does anyone know how to hook into the clear event so we can disable it's default behaviour and clear the selected option without opening the dropdown?

Cheers, Al

Answer 1

You don't require a timeout to make this work, here's my example:

$('#my-select').select2({     allowClear: true }).on('select2:unselecting', function() {     $(this).data('unselecting', true); }).on('select2:opening', function(e) {     if ($(this).data('unselecting')) {         $(this).removeData('unselecting');         e.preventDefault();     } }); 

Answer 2

Can confirm, preventing events seems to not work for some reason, so you can just close the dropdown after some timeout:

$("select").select2({     allowClear: true }).on("select2:unselecting", function(e) {     $(this).data('state', 'unselected'); }).on("select2:open", function(e) {     if ($(this).data('state') === 'unselected') {         $(this).removeData('state');           var self = $(this);         setTimeout(function() {             self.select2('close');         }, 1);     }     }); 

Here's a working fiddle: http://jsfiddle.net/obq3yLf2/