Home / Snippets / How to hide search box in select2
How to hide search box in select2 cover

How to hide search box in select2

6.9K

3 years ago

0 comments

In this short snippet, you will learn how to hide the search box on the select2 dropdown.

Hide Search box in Single select


In order to hide the search box in select2, you can hide the search box by setting "minimumResultsForSearch" to a negative value.
$('select').select2({
    minimumResultsForSearch: -1
});
Otherwise, you can set the value to infinity like the following.
$("#select").select2({
    minimumResultsForSearch: Infinity
});

Hide Search box in Multi-select


To hide the search box in multi-select you can write your code like below.
$('select').select2();

$('#select').on('select2:opening select2:closing', function( event ) {
    var $searchfield = $(this).parent().find('.select2-search__field');
    $searchfield.prop('disabled', true);
});
Thanks for stopping by and if you find this snippet helpful, do make sure to share it with your friends. Cheers!
notion avatar

Alaz

Week-end developer currently experimenting with web, mobile, and all things programming.

Topics:

Frontend

Resource

Average

Average

Support Us

If you like our tutorial, support us by being our Patreon or buy us some coffee ☕️

Welcome to PostSrc V3

PostSrc Dark Logo

You have to login to favorite this