/*
I have update the code
I think you used formacioninfo to query the database
and use javascript to filter the array
this will take a lot of compute power
better way to do is to query the result from the database
I have update the search function
if there is a dropdown value or input value
It will filter based on that
For another simillar sample check my site
you can see the code
https://salman2301/multiple-filter
*/
import { local } from âwix-storageâ ;
import wixData from âwix-dataâ ;
let formacioninfo = ;
// Results re-direction
// refactorNotes: Just use one onPageReady
$w . onReady ( function () {
// UPDATE UI SECTION
// refactorNotes: Use âletâ or âconstâ try to avoid âvarâ
let sameWord = local . getItem ( âsearchWordâ );
$w ( â#searchBarâ ). value = sameWord ;
$w ( â#searchBarâ ). placeholder = sameWord ;
// HANDLE EVENT SECTION
$w ( â#dataset1â ). onReady ( function () {
search ();
});
//Set the information to the repeater
// refactorNotes: You can call this function once
// refactorNotes: this will run everytime the data change
$w ( #listRepeater ). onItemReady (( $w , itemData , index ) => {
console . log ( itemData . title );
$w ( â#logoâ ). src = itemData . logo ;
$w ( â#titleâ ). text = itemData . nombreCurso ;
$w ( â#text12â ). text = itemData . especialidad ;
$w ( â#button2â ). label = ââŹâ + String ( itemData . precio );
$w ( â#text14â ). text = itemData . fecha ;
$w ( â#button1â ). label = itemData . tipo ;
$w ( â#text15â ). text = itemData . modalidad ;
});
$w ( â#iEspecialidad, #iMaxPrice, #iMinPriceâ ). onChange ( search );
$w ( â#iType, #iModalidadâ ). onClick ( search );
});
export function searchButton_click () {
search ();
}
//Filter function
// refactorNotes: get the data from the collection
// refactorNotes: avoid filtering the data using high order .filter() function
// refactorNotes: I am not sure about the purpost of âformacioninfoâ
function search () {
let query = wixData . query ( âFORMACIONâ );
const especialidad = $w ( â#iEspecialidadâ ). value ;
const tipo = $w ( â#iTypeâ ). value ;
const modalidad = $w ( â#iModalidadâ ). value ;
const maxprice = $w ( â#iMaxPriceâ ). value
const minprice = $w ( â#iMinPriceâ ). value
const searchBar = $w ( â#searchBarâ ). value ;
// results = formacioninfo.slice();
if ( searchBar ) {
query = query . contains ( ânombreCursoâ , searchBar )
. or ( wixData . query ( âFORMACIONâ ). contains ( âespecialidadâ , searchBar ))
. or ( wixData . query ( âFORMACIONâ ). contains ( âempresaâ , searchBar ))
}
if ( especialidad && especialidad !== âEscoge especialidadâ ) {
query = query . eq ( âespecialidadâ , especialidad );
}
if ( tipo && tipo !== âEscoge tipoâ ) {
query = query . eq ( âtipoâ , tipo );
}
if ( modalidad && modalidad !== âEscoge modalidadâ ) {
query = query . eq ( âmodalidadâ , modalidad );
}
if ( maxprice && maxprice !== âEscoge max precioâ ) {
query = query . le ( âprecioâ , maxprice );
}
if ( minprice && minprice !== âEscoge min precioâ ) {
query = query . ge ( âprecioâ , minprice );
}
query . find ()
. then ( res => {
$w ( â#listRepeaterâ ). data = res . items ;
})
. catch ( console . log );
}
)
BEST-MAN!
