Need an additional custom class to select2-container

We need an additional custom class to select2-container container to easily override the inner classes styles.

$("#e2").select2({
customClass: "Myselectbox",
});

So that corresponding container will formed as

<div class="Myselectbox select2-container select2-container-multi">

So that I can override an inner classes like .Myselectbox .select2-choices in CSS.

Generally this will help to override the textbox(ul.select2-choices) style.

Issue Analytics

State:
Created 11 years ago
Reactions:7
Comments:18 (4 by maintainers)

Top GitHub Comments

35reactions

imlunekcommented, Mar 10, 2016

I am using version 4.0.2. And on using containerCssClass it adds class to select2-selection. I guess the class is supposed to be added to the main wrapper select2-container.

Or, Is there any other way to add class to the main wrapper select2-container?

18reactions

glen-84commented, Oct 5, 2018

@pedrofurtado – this is clearly a bug, please re-open it.

How can you set something named containerCssClass, and have it affect the selection element and not the container element?

You can add another option named selectionCssClass to handle current use cases.

Top Results From Across the Web

Add class to select2 element - jquery - Stack Overflow

I found the containerCssClass method in the documentation, but I'm not sure how to apply it. I have tried the following with no...

Add class to Select2 control — DataTables forums

How would I go about adding an additional css style to a Select2 field? I'm trying to increase the number of displayed items...

Appearance | Select2 - The jQuery replacement for select boxes

Select2 is a jQuery based replacement for select boxes. It supports searching, remote data sets, and pagination (infinite scrolling) of results.

Select2 containerCssClass - CodePen

<div class="container">. 2. <label for="select2-multiple-input-sm" class="control-label">State</label>. 3. <select id="select2-multiple-input-sm" ...

Select2 and Bootstrap Integration by Keenthemes

Select2's CSS is highly customized in sass/vendors/plugins/_select2. · Select2's Javascript is globally initialized with some predefined settings in src/js/ ...