search

select2 / select2-bootstrap-theme

A Select2 v4 Theme for Bootstrap 3
https://select2.github.io/select2-bootstrap-theme/
MIT License
871 stars 498 forks source link

Adding .input-sm class, no effect #34

Closed bilalhdh closed 8 years ago

bilalhdh commented 8 years ago

Hi, when adding .input-sm class to the select, style not change and it kept same height so no effect. Thanks

bartczyz commented 8 years ago

Same here. :(

fk commented 8 years ago

Hey there! I am returning from a longer open source/Select2 hiatus and still not up-to-date with the current state of Select2 development in regards to this issue – maybe @kevin-brown can chime in.

The last I know is that

Select2 no longer copies classes to the dropdown and container

(ref. kevin-brown's comment) – this information is reflected in this note in select2-bootstrap-theme's demonstration pages.

fk commented 8 years ago

Small update: I took a closer look and found that if you include the full Select2 build – select2.full.js – you can set the containerCssClass option to :all: to copy the original elements CSS-classes to the select2 container.

I have set up a CodePen to show what it does: The original elements CSS-classes are added to span.select2-selection. However, this is not what select2-bootstrap-theme currently expects – which is that those classes are added to span.select2.select2-container.

@kevin-brown Should I look into rewriting the select2-bootstrap-theme CSS to support the current behavior of containerCssClass: ':all:'?

kevin-brown commented 8 years ago

@kevin-brown Should I look into rewriting the select2-bootstrap-theme CSS to support the current behavior of containerCssClass: ':all:'?

Yes, this is the expected behaviour of containerCssClass.

fk commented 8 years ago

@kevin-brown & all: I have this fixed (as in "rewrote the CSS to fit the expected behavior of containerCssClass) but untested in anything but Chrome, sitting in a local branch for three weeks now – but can't get around to free some time to test and merge. Please bear with me.

fk commented 8 years ago

Fixed in v0.1.0-beta.5: https://select2.github.io/select2-bootstrap-theme/4.0.0.html#requires-select2-full-js

matiazar commented 8 years ago

I have applyed this... my select now is small in size, but it doesn't open. Also if I dont put input-sm on my select, and I put this on select2 config containerCssClass: ':all:', it doesnt works. The select is not opening.

What can it be?

Im using Select2 4.0.3 and Css 0.1.0-beta.8

matiazar commented 8 years ago

I have found the problem... my select has a class called "select2" so when document loads $(".select2").select2({ width: '100%', placeholder: function(){ $(this).data('placeholder'); }, containerCssClass: ':all:', }); it copies the select2 class to the container and that makes all broken. there is another way to make this without the :all: class ?

on your examples page, this is not happening. Why ? Thanks !!!