Hi guys!
I’m trying to build a mega search for one of my databases.
I’m using the code as described here: https://www.wix.com/corvid/example/mega-search
Lodash is installed and it should be working… but it’s not. For some reason the repeater appears blank on preview mode and the checkbox group does not allow selection. As I cannot see the repeater, no idea if it is actually filtering data or not. Any help please? Thanks!!
That’s the code I’m using. I’ve kept some of the original item id’s but all match items in my webpage.
import wixData from 'wix-data';
import { debounce } from 'lodash';
const collectionName = 'FORMACION';
const debounceTime = 200;
$w.onReady(function () {
initComps();
initRepeater();
buildFiltersAndPopulateRepeater();
});
async function initComps() {
// populate iLocation dropdown
const res = await wixData.query(collectionName)
.ascending('especialidad')
.distinct('especialidad')
.then((especialidadData) => {
return especialidadData.items.map((especialidad) => {
return {
value: especialidad,
label: especialidad
}
});
});
$w('#iLocation').options = res;
// change max price according to type selection
$w('#iType').onChange((event) => {
$w('#iMaxPrice').max = event.target.value === 'Webminar' ? 20000 : 50000000;
});
// bind all input elements
const componentsTypeArray = ['RadioButtonGroup', 'Dropdown', 'Slider', 'CheckboxGroup'];
const debounceFunction = debounce(buildFiltersAndPopulateRepeater, debounceTime);
componentsTypeArray.forEach((compType) => {
const compArray = $w(compType);
compArray.forEach((comp) => {
comp.onChange((event) => {
debounceFunction();
});
});
});
}
async function buildFiltersAndPopulateRepeater() {
let dataQuery = wixData.query(collectionName);
dataQuery = dataQuery.eq('tipo', $w('#iType').value);
if ($w('#iLocation').value) {
dataQuery = dataQuery.eq('especialidad', $w('#iLocation').value);
}
// sliders
dataQuery = dataQuery.ge('horas', $w('#iSize').value);
dataQuery = dataQuery.ge('price', $w('#iMinPrice').value);
if ($w('#iMaxPrice').value > 0) {
dataQuery = dataQuery.le('precio', $w('#iMaxPrice').value);
}
// multiple selection
$w('#iOptions').value.forEach((selectedOption) => {
dataQuery = dataQuery.eq(selectedOption, true);
})
$w('#listRepeater').data = await dataQuery.find().then((res) => res.items);
}
function initRepeater() {
$w('#listRepeater').onItemReady(($item, itemData) => {
$item('#logo').src = itemData.logo;
$item('#title').text = itemData.nombreCurso;
$item('#text12').text = itemData.especialidad;
$item('#button2').label = '€' + String(itemData.precio);
$item('#button1').label = itemData.tipo;
$item('#text14').text = String(itemData.fecha);
});
}