deblan-mirror/Choices
deblan-mirror/Choices
1
0
Fork 0
mirror of https://github.com/Choices-js/Choices.git synced 2024-05-20 22:46:33 +02:00
Code Issues Projects Releases Wiki Activity

Highlight/unhighlight callbacks

Browse source
This commit is contained in:
Josh Johnson 2016-08-04 13:21:24 +01:00
parent 0e44a4b8e3
commit 322f250b7f
4 changed files with 44 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
README.md
View file

@ -76,8 +76,9 @@ A lightweight, configurable select box/text input plugin. Similar to Select2 and
callbackOnInit: () => {},
callbackOnAddItem: (id, value, passedInput) => {},
callbackOnRemoveItem: (id, value, passedInput) => {},
callbackOnHighlightItem: (id, value, passedInput) => {},
callbackOnUnhighlightItem: (id, value, passedInput) => {},
callbackOnChange: (value, passedInput) => {},
callbackOnRender: () => {},
});
</script>
```
@ -340,6 +341,20 @@ classNames: {
<strong>Usage:</strong> Function to run each time an item is removed (programmatically or by the user).
### callbackOnHighlightItem
<strong>Type:</strong> `Function` <strong>Default:</strong>`(id, value, passedInput) => {}`
<strong>Input types affected:</strong> `text`, `select-multiple`
<strong>Usage:</strong> Function to run each time an item is highlighted.
### callbackOnUnhighlightItem
<strong>Type:</strong> `Function` <strong>Default:</strong>`(id, value, passedInput) => {}`
<strong>Input types affected:</strong> `text`, `select-multiple`
<strong>Usage:</strong> Function to run each time an item is unhighlighted.
### callbackOnChange
<strong>Type:</strong> `Function` <strong>Default:</strong>`(value, passedInput) => {}`

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

File diff suppressed because one or more lines are too long

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

@ -73,6 +73,8 @@ export class Choices {
callbackOnInit: () => {},
callbackOnAddItem: (id, value, passedInput) => {},
callbackOnRemoveItem: (id, value, passedInput) => {},
callbackOnHighlightItem: (id, value, passedInput) => {},
callbackOnUnhighlightItem: (id, value, passedInput) => {},
callbackOnChange: (value, passedInput) => {},
};
@ -209,6 +211,16 @@ export class Choices {
const id = item.id;
this.store.dispatch(highlightItem(id, true));
// Run callback if it is a function
if(this.config.callbackOnHighlightItem){
const callback = this.config.callbackOnHighlightItem;
if(isType('Function', callback)) {
callback(id, item.value, this.passedElement);
} else {
console.error('callbackOnHighlightItem: Callback is not a function');
}
}
return this;
}
@ -223,6 +235,16 @@ export class Choices {
const id = item.id;
this.store.dispatch(highlightItem(id, false));
// Run callback if it is a function
if(this.config.callbackOnUnhighlightItem){
const callback = this.config.callbackOnUnhighlightItem;
if(isType('Function', callback)) {
callback(id, item.value, this.passedElement);
} else {
console.error('callbackOnUnhighlightItem: Callback is not a function');
}
}
return this;
}
@ -562,7 +584,6 @@ export class Choices {
}
const callback = (results, value, label) => {
if(!isType('Array', results) || !value) return;
if(results && results.length) {
this.containerOuter.classList.remove(this.config.classNames.loadingState);
const filter = this.config.sortFilter;
@ -576,7 +597,6 @@ export class Choices {
}
});
}
this.containerOuter.removeAttribute('aria-busy');
};
fn(callback);
@ -982,7 +1002,9 @@ export class Choices {
if(item.id === parseInt(passedId) && !item.highlighted) {
this.highlightItem(item);
} else if(!hasShiftKey) {
this.unhighlightItem(item);
if(item.highlighted) {
this.unhighlightItem(item);
}
}
});
}

2
index.html
View file

@ -163,7 +163,7 @@
delimiter: ',',
editItems: true,
maxItemCount: 5,
removeItemButton: true
removeItemButton: true,
});
console.log(example1.getValue());