Comments (2)
Icons can't be displayed in normal <selects>
. If you absolutely need to show icons you'll need to use something like DropKick.js or Select2. (Shameless plug, ember-dropkick
is an extension of x-select)
In your example code I don't see where optgroups are being added. x-select is a thin ember wrapper around a native
select, so native HTML elements should work. Try wrapping an <optgroup>
tag around the {{#each}}
.
Hope this helps!
from emberx-select.
You're right, although it'd be a nice addition anyway if it's not too much work.
Decided to go with the following recipe instead:
<div class="form-group">
<label class="control-label col-sm-2" for="select-icon">Icon:</label>
<div class="col-sm-2">
<div class="btn-group">
<button type="button" class="btn btn-default">
<i class="fa fa-{{currentIcon}}"></i> {{currentIcon}}
</button>
<button type="button" class="btn btn-default dropdown-toggle" \
data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="caret"></span>
<span class="sr-only">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu">
{{#each icons as |optgroup|}}
<li class="disabled">
<a href="#"><strong> - {{optgroup.group}} - </strong></a>
</li>
{{#each optgroup.icons as |icon|}}
<li>
<a href="#" {{action 'selectIcon' icon}}>
<i class="fa fa-{{icon}}"></i> {{icon}}
</a>
</li>
{{/each}}
{{/each}}
</ul>
</div>
</div>
</div>
from emberx-select.
Related Issues (20)
- Weekly Digest (9 September, 2018 - 16 September, 2018)
- Deprecation warning in Ember 3.4 HOT 1
- Behaviour of {select} integration helper, only works with `on-change`? HOT 3
- Weekly Digest (14 October, 2018 - 21 October, 2018)
- Deploys to surge not working
- ReferenceError: event is not defined - Firefox HOT 6
- Could not find module `@bigtest/interactor` HOT 5
- <xSelect> is not a component and doesn't support block parameters HOT 2
- onChange instead of on-change HOT 1
- Issue in edit case in multiple selected dropdown.
- Migrate to adopted-ember-addons
- Ensure that DEMO url continues to function after micration to adopted-ember-addons
- action arguments change order when optional argument is passed in
- When select is rendered it should not fire `onChange` action if `value` property is equal to `null` or `undefined` HOT 2
- Getting to a v4 release
- How do I upgrade to using the v4.0.0 beta
- Cannot get value HOT 1
- Usage with Octane: Error: Assertion Failed: You cannot access this.$() with `jQuery` disabled. HOT 2
- Error: Assertion Failed: You attempted to update `[]` on `<Array:ember187>`, but it had already been used previously in the same computation. Attempting to update a value after using it in a computation can cause logical errors, infinite revalidation bugs, and performance issues, and is not supported.
- Upgrade babel dependency to fix deprecation warning: "Deprecate the Ember Global"
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from emberx-select.