Ability to specify no result/no choice dropdown text

This commit is contained in:
Josh Johnson 2016-08-14 15:36:11 +01:00
parent 1cacf4798b
commit 6e712476bd
3 changed files with 23 additions and 5 deletions

View file

@ -48,6 +48,8 @@ A vanilla, lightweight (~15kb gzipped 🎉), configurable select box/text input
prependValue: null,
appendValue: null,
loadingText: 'Loading...',
noResultsText: 'No results round',
noChoicesText: 'No choices to choose from',
classNames: {
containerOuter: 'choices',
containerInner: 'choices__inner',
@ -274,14 +276,28 @@ const example = new Choices(element, {
<strong>Input types affected:</strong> `text`, `select-one`, `select-multiple`
<strong>Usage:</strong> Append a value to each item added/selected
<strong>Usage:</strong> Append a value to each item added/selected.
### loadingText
<strong>Type:</strong> `String` <strong>Default:</strong> `Loading...`
<strong>Input types affected:</strong> `select-one`, `select-multiple`
<strong>Usage:</strong> The loading text that is shown when options are populated via an AJAX callback.
<strong>Usage:</strong> The text that is shown whilst choices are being populated via AJAX.
### noResultsText
<strong>Type:</strong> `String` <strong>Default:</strong> `No results round`
<strong>Input types affected:</strong> `select-one`, `select-multiple`
<strong>Usage:</strong> The text that is shown when a user's search has returned no results.
### noChoicesText
<strong>Type:</strong> `String` <strong>Default:</strong> `No choices to choose from`
<strong>Input types affected:</strong> `select-multiple`
<strong>Usage:</strong> The text that is shown when a user has selected all possible choices.
### classNames
<strong>Type:</strong> `Object` <strong>Default:</strong>

File diff suppressed because one or more lines are too long

View file

@ -45,6 +45,8 @@ export class Choices {
prependValue: null,
appendValue: null,
loadingText: 'Loading...',
noResultsText: 'No results round',
noChoicesText: 'No choices to choose from',
classNames: {
containerOuter: 'choices',
containerInner: 'choices__inner',
@ -1877,7 +1879,7 @@ export class Choices {
this._highlightChoice();
} else {
// Otherwise show a notice
const dropdownItem = this.isSearching ? this._getTemplate('notice', 'No results found') : this._getTemplate('notice', 'No choices to choose from');
const dropdownItem = this.isSearching ? this._getTemplate('notice', this.config.noResultsText) : this._getTemplate('notice', this.config.noChoicesText);
this.choiceList.appendChild(dropdownItem);
}
}