Select2 jquery plugin show number of selected items in the result instead of tags

Question

I am using Select2 jQuery Plugin.

https://select2.github.io/ for reference

When I am using the multiple dropdown option. The result of selec

Answer 1

Selectors can certainly be improved, but as a blueprint, adding a counter element on change and hiding the tags like this seems to work as asked.

$('select').select2({closeOnSelect: false}).on("change", function(e) {
  $('.select2-selection__rendered li:not(.select2-search--inline)').hide();
  $('.counter').remove();
  var counter = $(".select2-selection__choice").length;
  $('.select2-selection__rendered').after('
'+counter+' selected
');
});

.counter{
  position:absolute;
  top:0px;
  right:5px;
 }
 .select2-search--inline{
   background-color:Gainsboro;
 }

  Name1
  Name2
  Name3
  Name4
  Name5
  Name6
  Name7