How to set size of ui-select?

javascript angularjs ui-select
xlhuang picture xlhuang · Aug 23, 2015 · Viewed 7.3k times · Source

I'm using ui-select with bootstrap. as we know, bootstrap has input-lg, input-sm... but is there a good way to change the size of ui-select?

Answer

Georgy picture Georgy · Sep 23, 2015

Could you please tell what is "a good way" for you? If CSS is good enough, then you can style elements with it, would look like this.

.form-input-sm .ui-select-toggle {height: 40px}

That is for simple HTML:

<ui-select theme="bootstrap" ng-model="model">
  <ui-select-match placeholder="Placeholder"></ui-select-match>
  <ui-select-choices refresh-delay="0" repeat="item in roleList">
    <div>{{item.name}}</div>
  </ui-select-choices>
</ui-select>

And I'm not magician, I don't know the selectors just looking at HTML here. If you need to find proper selectors, you can use browser developer tools. The same technique is used to override all default styles in Bootstrap, for example.

Related questions

AngularJs: How make ui-select working properly?

THE SITUATION: I am making an angular app where I have to use ui-select: in the user info page, in the select have to be possible to choose one or many tag. It is almost working, except from the fact …

Read More
how to set a default value for angular ui-select

Question : how to set default value to the angular ui-select drop down values are fetched from object and object wont be having default value. and ui-select should set the default value in Frontend. eg: drop down values are as follows 1 …

Read More
Angularjs validation for ui-select multiple

THE SITUATION: I have an angular app that send emails. There is a form with three fields: Address - Subject - Text. For the address field I am using angular ui-select. Everything is working fine, except the validation on the …

Read More