ui-select
ui-select copied to clipboard
Feature: Option to not select first item in select-choices by default.
I've created a plunker that shows a basic use case. http://plnkr.co/XfuJozUv5YfFnYHsVnZA
There aren't very many select options so the best way to see what i'm talking about it to type 'state' and hit enter. This closes the choices and uses 'state' as the search. If you want to select state press down then enter.
I'm actually not totally in love with the firstItemActive name. It's pretty descriptive since it changes the initial value of activeIndex... But I'm open to other suggestions.
The way I'm using this is as a filter/search box combo. If the first item isn't active by default I can hit enter and search on the text or I can press down to choose an option.
+1
I really want this feature. When will you release it?
I needed this, thanks for the solution, I patched it into the version I am using now. But I found there is at least one mistake in uiSelectController.js, preventing setting previously selected values active. When firstItemActive is true, the code after "ensure that the index..." comment always resets the activeIndex. It should instead be like this:
if (ctrl.activeIndex === -1 && ctrl.taggingLabel !== false) {
ctrl.activeIndex = ctrl.firstItemActive ? 0 : -1;
}
Another thing that didn't work for me is in the function '_resetSearchInput()', because I am using objects in certain ui-selects, which will not be correctly identified as identical by the current version. So I enhanced it to look for an 'id' property, which is perfect for a Grails backend, but might not work for everyone:
// Most of the time the user does not want to empty the search input when in typeahead mode
function _resetSearchInput() {
if (ctrl.resetSearchInput || (ctrl.resetSearchInput === undefined && uiSelectConfig.resetSearchInput)) {
ctrl.search = EMPTY_SEARCH;
//reset activeIndex
if (ctrl.selected && ctrl.items.length && !ctrl.multiple) {
if (angular.isObject(ctrl.selected) && angular.isDefined(ctrl.selected.id)) {
// complex way by ID, because objects may be identical but not the same
for (var loop = 0, max = ctrl.items.length, target = ctrl.selected.id; loop < max; loop++) {
if (ctrl.items[loop].id == target) {
ctrl.activeIndex = loop;
break;
}
}
} else {
// simple way
ctrl.activeIndex = ctrl.items.indexOf(ctrl.selected);
}
}
}
}
Also my implementation is not neccessarily the most efficient, but it works for me.
This needs rebasing.
@wesleycho I can do the merge if given the rights to resolve this issue. We also need this functionality on our team.
@granteagon I added you you as a collaborator on my branch.
@clydetacoma I think I know what @wesleycho was getting at when he tagged with "needs rebasing". Your fork diverged for a long time before the current release, so getting the code back in causes the need for a merge and doesn't show a clean repository history if we try to merge and get things back in order. I have forked the repo myself and will add your changes in and do a new pull request. If you want, we can keep things on your fork, but we need to fast-forward to get things up to date first, and then manually patch in your changes. I can do that myself, but wanted to keep you apprised of what's going on.
Is this still going to be added?
@randdusing This repo is dead. I will be building a new version in typescript this year, but it's a few months from completion. You can try my version here where I've fixed a few bugs if you like. Might get you past this issue. My version just has bug fixes applied that this repo is no longer responding to.
@granteagon You mean ui-select is dead or just this branch?
@randdusing ui-select is dead man.
Fixed in my fork here - firstItemActive disabled by default. This is based off the code changes in this PR & the latest published changes w/v0.19.8 (not the latest on master).
Update your package.json with the below line, yarn or npm install and you should be good to go:
"ui-select": "git+https://github.com/theandrewlane/ui-select#master"