Filter items in repeaters according to boolean value

Ask the community
,
1

Hi,
I have a dynamic page that displays items, I also created a table where users can filter items depending on 3 criteria (search bar, select category, select retailer) but I also want items to display according to the value of a checkbox, that would be ‘show/hide items that have expired’.

I’ve already added a boolean field (dispo) in the database, which I check if the item has expired.

Here my code

import wixData from 'wix-data';

$w.onReady(function () {
	$w("#dynamicDataset").onReady( () => {
$w("#repeater2").onItemReady( ($w) => {
	$w("#repeater2").forEachItem( ($w) => {
	//strikes through 'previous price'
  	$w("#text63").html = `<span style="font-family:arial; font-style: italic; color:#C0C0C0; text-decoration: line-through;font-size:17px">${$w("#text63").text}</span>`;
  
	} );
	//modifies the time and date
const originalDate = $w("#text62").text;
const newDate = originalDate.split(' ').splice(1, 4).join(' ');
$w('#text62').text = newDate;
 console.log('Time removed from Date/Time Stamp: New Date ' + newDate);
	});
});
});

//searches keywords typed in the search bar upon pressing 'Enter'
export function searchInput_keyPress(event, $w) {
	if (event.key === "Enter") {
	$w("#dynamicDataset").setFilter(wixData.filter()
	.contains("title", $w("#searchInput").value)
	.contains("categorie", $w("#categorieInput").value)
	.contains("vendeur", $w("#vendeurInput").value));
	}
}

//searches after typing in the search text input
export function shape18_click(event, $w) {
	$w("#dynamicDataset").setFilter(wixData.filter()
	.contains("title", $w("#searchInput").value)
	.contains("categorie", $w("#categorieInput").value)
	.contains("vendeur", $w("#vendeurInput").value));
}

//selects the 'categorie' input
export function categorieInput_change(event, $w) {
		$w("#dynamicDataset").setFilter(wixData.filter()
		.contains("title", $w("#searchInput").value)
		.contains("categorie", $w("#categorieInput").value)
		.contains("vendeur", $w("#vendeurInput").value));
}

//selects the 'vendeur' input
export function vendeurInput_change(event, $w) {
	$w("#dynamicDataset").setFilter(wixData.filter()
	.contains("title", $w("#searchInput").value)
	.contains("categorie", $w("#categorieInput").value)
	.contains("vendeur", $w("#vendeurInput").value));
}

//resets the 'categorie' input
export function shape16_click(event, $w) {
	$w("#categorieInput").value = null;
	$w("#dynamicDataset").setFilter(wixData.filter()
		.contains("title", $w("#searchInput").value)
		.contains("categorie", $w("#categorieInput").value)
		.contains("vendeur", $w("#vendeurInput").value));
}

//resets the 'vendeur' input
export function shape17_click(event, $w) {
		$w("#vendeurInput").value = null;
		$w("#dynamicDataset").setFilter(wixData.filter()
		.contains("title", $w("#searchInput").value)
		.contains("categorie", $w("#categorieInput").value)
		.contains("vendeur", $w("#vendeurInput").value));
}
2

Hi Tristan,

Add an onChange event to the checkbox and call setFilter.
for example if your boolean value is isChecked use:

.eq(“status”, isChecked)

3

I don’t get it all, here’s what I have :

export function checkbox1_change(event, $w) {
 $w("#dynamicDataset").setFilter(wixData.filter()
 .eq("status", isChecked));
}

the “isChecked” shows an error

The checkbox is checked by default, which shoukld hide expired items in the repeater.
If it is unchecked, it should show ALL items (expired + non expired)
I haven’t connected the checkbox to the dataset, should I ?

What’s “status” ? The name of the field in the collection ? (which in my case is “dispo”)

4

Hi Tristan,

Did not get it working based on the hints above. For now I have a applied a work-around. I have created a textfield (field key: “active”) in my database which I populate with “y” and “n”. y stands for checked box an n stands for an unchecked box. Based on that info added this line to the code:
.eq(“active”, “y”)

So my reset code now looks like this:
// Reset button code:
$w(“#button12”).onClick(() => {
$w(“#dropdown1”).value = null;
$w(“#dropdown2”).value = null;
$w(“#dataset1”).setFilter(wixData.filter()
.eq(“active”, “y”)
);

Frustrating I could not get the filter working on the checkboxes, but for now I can move on. Please drop me a note if you find the proper solution.

5

So you bypassed by adding a condition according to a text value ? This could work indeed, but a boolean is much more convenient !

Thanks though ! :slight_smile:

6

That is correct. Used a condition on a text field in my database. Agree with you that the boolean is more convenient, but for now I had to move forward, one way or another. So if I have more time in the future I will give this another go or hopefully you will figure it and I copy your solution. :slight_smile:

7

Bump, if anyone knows what bit of code is required to do that ! :slight_smile:

8

Hi

check this

.eq(‘dispo’,Boolean(true))
or
.eq(‘dispo’,Boolean(false))

Br

2 Likes
9

This worked for me.

10

Thanks Ammar Alhodaibi, this worked out pretty well for me as well.