feature/RVRNEXT-30-replace-choices-to-tomselect #41
@ -1,17 +1,31 @@
|
||||
(function () {
|
||||
const element = document.getElementById('newMember').elements['user_id'];
|
||||
const choices = new Choices(element, {
|
||||
noResultsText: 'No users found',
|
||||
noChoicesText: 'Start typing to search users'
|
||||
const select = new TomSelect(element, {
|
||||
placeholder: 'User',
|
||||
valueField: 'value',
|
||||
labelField: 'label',
|
||||
searchField: 'label',
|
||||
loadThrottle: 300,
|
||||
load: function (query, callback) {
|
||||
var self = this;
|
||||
RVR.httpRequest('GET', searchUserUrl.replace('QUERY', encodeURIComponent(query)), function () {
|
||||
self.clearOptions();
|
||||
callback(this.response.results);
|
||||
});
|
||||
},
|
||||
});
|
||||
|
||||
element.addEventListener('search', RVR.debounce(async function (e) {
|
||||
RVR.httpRequest('GET', searchUserUrl.replace('QUERY', encodeURIComponent(e.detail.value)), function () {
|
||||
choices.setChoices(this.response.results, 'value', 'label', true);
|
||||
select.on('change', function (value) {
|
||||
this.clearOptions();
|
||||
});
|
||||
}));
|
||||
|
||||
element.addEventListener('choice', function () {
|
||||
choices.setChoices([], 'value', 'label', true);
|
||||
select.on('blur', function (value) {
|
||||
this.clearOptions();
|
||||
});
|
||||
|
||||
select.on('type', function (value) {
|
||||
if (value === '') {
|
||||
this.clearOptions();
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
Loading…
Reference in New Issue
Block a user