Hello,
For several hours I have been trying to display the practitioners in random order.
For example if I have 10 practitioners in the region of Occitania, I want that at each submission I do not have the same order and the same when I choose the department or when it displays all practitioners and I would also like to be able to change region or department without resetting with the reset button.
Thank you in advance for your help.
Here is the modified code:
import wixData from 'wix-data';
$w.onReady(function () {
$w("#dropdownreg, #dropdowndep").onChange(function () {
search();
});
dropdownreg(); // appel de la fonction dropdownreg lors du chargement de la page
});
function dropdownreg() {
wixData.query("Listepraticiens")
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w("#dropdownreg").options = buildOptions(uniqueTitles);
$w("#dropdownreg").value = undefined; // réinitialisation de la valeur du dropdown lorsque la fonction est appelée
dropdowndep(); // appel de la fonction dropdowndep lorsque la région est changée
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.region);
return [...new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}
function locationCityFilter() {
const region = $w("#dropdownreg").value; // récupération de la valeur de la région
$w("#dataPraticien").setFilter(wixData.filter()
.eq("region", region)
.and(
wixData.filter().contains("departement", String($w('#dropdowndep').value))
)
);
}
function dropdowndep() {
const region = $w("#dropdownreg").value; // récupération de la valeur de la région
wixData.query("Listepraticiens")
.contains("region", region)
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w("#dropdowndep").options = buildOptions(uniqueTitles);
$w("#dropdowndep").value = undefined; // réinitialisation de la valeur du dropdown lorsque la fonction est appelée
locationCityFilter(); // appel de la fonction locationCityFilter lorsque le département est changé
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.departement);
return [...new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}
function search() {
locationCityFilter(); // appel de la fonction pour filtrer les résultats en fonction de la région et du département choisis
const query = wixData.query("Listepraticiens")
.contains('departement', String($w('#dropdowndep').value))
.and(wixData.filter().eq("region", String($w('#dropdownreg').value)))
.ascending("_random"); // ajout de l'ordre aléatoire
$w("#dataPraticien").onReady(() => {
$w("#dataPraticien").setFilter(query)
.then(count);
});
//COUNT FUNCTION👍
function count() {
let total = $w('#dataPraticien').getTotalCount();
if (total > 1) {
$w('#nbrpraticiens').text = `${total} praticiens trouvés`;
$w('#nbrpraticiens').show();
}
if (total === 1) {
$w('#nbrpraticiens').text = `${total} praticien trouvé`;
$w('#nbrpraticiens').show();
}
if (total === 0) {
$w('#nbrpraticiens').text = "Nous n'avons pas encore de praticien dans ce secteur";
$w('#nbrpraticiens').show();
}
//SCROLL TO THE TOP WHEN PAGINATION IS CHANGED ⚡
$w("#pagination1").onChange(() => {
$w("#haut").scrollTo();
});
}
}
Here is the original code:
import wixData from 'wix-data';
$w.onReady(function () {
$w("#dropdownreg, #dropdowndep").onChange(function () {
search();
});
});
dropdownreg();
//SEARCH BUTTON TRIGGER⚡
$w("#searchButton2").onClick(function () {
search();
});
function dropdownreg() {
wixData.query("#dataPraticien")
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w("#dropdownreg").options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.region);
return [...new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}
export function dropdownreg_change(event, $w) {
dropdowndep();
$w("#dropdowndep").enable();
locationCityFilter();
}
function locationCityFilter() {
$w("#dataPraticien").setFilter(wixData.filter()
.eq("region", $w("#dropdownreg").value)
);
}
function dropdowndep() {
wixData.query("#dataPraticien")
.contains("departement", $w("#dropdownreg").value)
.limit(1000)
.find()
.then(results => {
const uniqueTitles = getUniqueTitles(results.items);
$w("#dropdowndep").options = buildOptions(uniqueTitles);
});
function getUniqueTitles(items) {
const titlesOnly = items.map(item => item.departement);
return [...new Set(titlesOnly)];
}
function buildOptions(uniqueList) {
return uniqueList.map(curr => {
return { label: curr, value: curr };
});
}
}
function search() {
$w("#dataPraticien").onReady(function () {
$w("#dataPraticien").setFilter(wixData.filter().contains('departement', String($w('#dropdowndep').value))
.and(wixData.filter().contains("region", String($w('#dropdownreg').value))))
.then(count)
});
//CLEAR FILTER 🚀
$w("#button31").onClick(function () {
$w("#dropdowndep").value = undefined;
$w("#dropdownreg").value = undefined;
$w("#dataPraticien").setFilter(wixData.filter());
$w('#nbrpraticiens').hide();
});
//COUNT FUNCTION👍
function count() {
let total = $w('#dataPraticien').getTotalCount();
if (total > 1) {
$w('#nbrpraticiens').text = `${total} praticiens trouvés`;
$w('#nbrpraticiens').show();
}
if (total === 1) {
$w('#nbrpraticiens').text = `${total} praticien trouvé`;
$w('#nbrpraticiens').show();
}
if (total === 0) {
$w('#nbrpraticiens').text = "Nous n'avons pas encore de praticien dans ce secteur";
$w('#nbrpraticiens').show();
}
//SCROLL TO THE TOP WHEN PAGINATION IS CHANGED ⚡
$w("#pagination1").onChange(() => {
$w("#haut").scrollTo();
});
}
}
and also i forgot to mention that the very first code-line of your page code of course should be an IMPORT, if you are using some API-Functions…
