set the width of select2 input (through Angular-ui directive)

bsr picture bsr · Oct 2, 2012 · Viewed 169.1k times · Source

I have problem making this plunkr (select2 + angulat-ui) work.

http://plnkr.co/edit/NkdWUO?p=preview

In local setup, I get the select2 work, but I cannot set the width as described in the docs. It is too narrow to be used.

enter image description here

Thank you.

EDIT: Never mind that plnkr, I found a working fiddle here http://jsfiddle.net/pEFy6/

It looks like it is the behavior of select2 to collapse to the width of first element. I could set the width through bootstrap class="input-medium" .Still not sure why angular-ui doesn't take config parameters.

Answer

portforwardpodcast picture portforwardpodcast · Jan 18, 2014

In my case the select2 would open correctly if there was zero or more pills.

But if there was one or more pills, and I deleted them all, it would shrink to the smallest width. My solution was simply:

$("#myselect").select2({ width: '100%' });