deblan-mirror/Choices
deblan-mirror/Choices
1
0
Fork 0
mirror of https://github.com/Choices-js/Choices.git synced 2024-05-17 21:16:34 +02:00
Code Issues Projects Releases Wiki Activity

Reset search on key up if a user has deleted value

Browse source
This commit is contained in:
Josh Johnson 2016-08-08 14:35:14 +01:00
parent b17c3a1289
commit 12dd5ef28d
2 changed files with 25 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
assets/scripts/dist/choices.min.js vendored
View file

File diff suppressed because one or more lines are too long

25
assets/scripts/src/choices.js
View file

@ -917,7 +917,8 @@ export class Choices {
if(hasFocusedInput && !e.target.value && this.passedElement.type !== 'select-one') {
this._handleBackspace(activeItems);
e.preventDefault();
}
};
break;
default:
@ -934,6 +935,8 @@ export class Choices {
_onKeyUp(e) {
if(e.target !== this.input) return;
const keyString = String.fromCharCode(e.keyCode);
const backKey = 46;
const deleteKey = 8;
// We are typing into a text input and have a value, we want to show a dropdown
// notice. Otherwise hide the dropdown
@ -976,6 +979,14 @@ export class Choices {
}
}
} else {
// If user has removed value...
if((e.keyCode === backKey || e.keyCode === deleteKey) && !e.target.value) {
// ...and it is a multiple select input, activate choices
if(this.passedElement.type === 'select-multiple') {
this.isSearching = false;
this.store.dispatch(activateChoices(true));
}
}
// If we have enabled text search
if(this.canSearch) {
this._searchChoices(this.input.value);
@ -991,7 +1002,17 @@ export class Choices {
*/
_onInput(e) {
if(this.passedElement.type !== 'select-one') {
this.input.style.width = getWidthOfInput(this.input);
if (this.config.placeholder && (this.config.placeholderValue || this.passedElement.getAttribute('placeholder'))) {
// If there is a placeholder, we only want to set the width of the input when it is a greater
// length than the placeholder. This stops the input jumping around.
const placeholder = this.config.placeholderValue || this.passedElement.getAttribute('placeholder');
if(this.input.value && this.input.value.length > placeholder.length) {
this.input.style.width = getWidthOfInput(this.input);
}
} else {
// If there is no placeholder, resize input to contents
this.input.style.width = getWidthOfInput(this.input);
}
}
}