Fix search by input
This commit is contained in:
parent
c228ff0be4
commit
876107d520
|
@ -13,14 +13,18 @@ export default class FilterableList {
|
||||||
|
|
||||||
initSearch() {
|
initSearch() {
|
||||||
// Wrap to prevent passing event arguments to .filterResults;
|
// Wrap to prevent passing event arguments to .filterResults;
|
||||||
this.debounceFilter = _.debounce(() => {
|
this.debounceFilter = _.debounce(this.onFilterInput.bind(this), 500);
|
||||||
this.filterResults();
|
|
||||||
}, 500);
|
|
||||||
|
|
||||||
this.unbindEvents();
|
this.unbindEvents();
|
||||||
this.bindEvents();
|
this.bindEvents();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onFilterInput() {
|
||||||
|
const url = this.filterForm.getAttribute('action');
|
||||||
|
const data = $(this.filterForm).serialize();
|
||||||
|
this.filterResults(url, data, 'filter-input');
|
||||||
|
}
|
||||||
|
|
||||||
bindEvents() {
|
bindEvents() {
|
||||||
this.listFilterElement.addEventListener('input', this.debounceFilter);
|
this.listFilterElement.addEventListener('input', this.debounceFilter);
|
||||||
}
|
}
|
||||||
|
@ -29,7 +33,7 @@ export default class FilterableList {
|
||||||
this.listFilterElement.removeEventListener('input', this.debounceFilter);
|
this.listFilterElement.removeEventListener('input', this.debounceFilter);
|
||||||
}
|
}
|
||||||
|
|
||||||
filterResults(url, data) {
|
filterResults(url, data, comingFrom) {
|
||||||
const endpoint = url || this.filterForm.getAttribute('action');
|
const endpoint = url || this.filterForm.getAttribute('action');
|
||||||
const additionalData = data || $(this.filterForm).serialize();
|
const additionalData = data || $(this.filterForm).serialize();
|
||||||
|
|
||||||
|
@ -42,7 +46,13 @@ export default class FilterableList {
|
||||||
dataType: 'json',
|
dataType: 'json',
|
||||||
context: this,
|
context: this,
|
||||||
complete: this.onFilterComplete,
|
complete: this.onFilterComplete,
|
||||||
success: this.onFilterSuccess,
|
success: (response, textStatus, xhr) => {
|
||||||
|
if (this.preOnFilterSuccess) {
|
||||||
|
this.preOnFilterSuccess(comingFrom);
|
||||||
|
}
|
||||||
|
|
||||||
|
this.onFilterSuccess(response, xhr);
|
||||||
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -16,12 +16,10 @@ export default {
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
onClickRowGroup(e) {
|
onClickRowGroup(e) {
|
||||||
// e.stopPropagation();
|
e.stopPropagation();
|
||||||
|
|
||||||
// Skip for buttons
|
// Skip for buttons
|
||||||
if (e.target.tagName === 'A' ||
|
if (!(e.target.tagName === 'A') && !(e.target.tagName === 'I' && e.target.parentElement.tagName === 'A')) {
|
||||||
(e.target.tagName === 'I' && e.target.parentElement.tagName === 'A')) {
|
|
||||||
} else {
|
|
||||||
if (this.group.hasSubgroups) {
|
if (this.group.hasSubgroups) {
|
||||||
eventHub.$emit('toggleSubGroups', this.group);
|
eventHub.$emit('toggleSubGroups', this.group);
|
||||||
} else {
|
} else {
|
||||||
|
|
|
@ -33,7 +33,13 @@ export default class GroupFilterableList extends FilterableList {
|
||||||
this.filterResults(this.filterUrl);
|
this.filterResults(this.filterUrl);
|
||||||
}
|
}
|
||||||
|
|
||||||
onFilterSuccess(data, textStatus, xhr) {
|
preOnFilterSuccess(comingFrom) {
|
||||||
|
if (comingFrom === 'filter-input') {
|
||||||
|
this.filterUrl = `${this.filterForm.getAttribute('action')}?${$(this.filterForm).serialize()}`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onFilterSuccess(data, xhr) {
|
||||||
super.onFilterSuccess(data);
|
super.onFilterSuccess(data);
|
||||||
|
|
||||||
this.store.setGroups(data);
|
this.store.setGroups(data);
|
||||||
|
|
Loading…
Reference in New Issue