Hiding an element if a repeater is empty

Ask the community
,
1

Hi all!

I have made a “similar items” repeater on a dynamic page and have placed a text element as its title, whenever there are no similar items, I would like its title and the repeater to collapse.

I have tried several methods of doing this, does anybody have any ideas, thanks!

2

Hi Nicolas,
Some code is required.
My suggestion is to combine this code in your dynamic page’s code.

import wixData from 'wix-data';
$.onReady(() => {
  wixData.query("myCollection") 
  .count() 
  .then( (num) => { 
    let numberOfItems = num; 
    if (numberOfItems === 0) {
      $w('#yourTextElement').collapse();
      $w('#yourRepeater').collapse();
    }
  }) 
  .catch( (error) => { 
    let errorMsg = error.message; 
    let code = error.code; 
  });
});

Good luck!
Roi.

3

Hi Roi, thanks for your answer.

I have the following problem while implementing it: since I have a dataset and do not want to count the items in the databse collection, instead, count the items in the dataset, I cannot run a query on the datset.
Could you please help me on this? Could I count the items in the dataset?

Thank You!

4

Hi,
Are you familiar with getItems method ?
Please update in your progress! :slight_smile:
Roi.

5

Hi Roi,

Thank you for your follow-up.

I did dive into the getItems method and got the code I pasted below. It is currently not working. I am not totally sure of what is missing here, I would really appreciate your help.

To recap:

  • dataset3 (Similar Dataset) is the dataset I’m using to display the similar items, whenever the items that match the filters of the dataset are equal to zero (none). I would like for the group 10 (my text, in this case the “also at location”) as well as the repeater (repeater2) to collapse.

1216×349 59.8 KB

$w("#dataset3").getItems()
	.then((result) => {
		let totalCount = result.totalCount;

		if (totalCount === 0) {
			$w('#group10').collapse();
			$w('#repeater2').collapse();
		}
	});

Thank You!

1 Like
6

NicolasGPS,
I just did this in my own repeater.
This is my code. Try hide instead of collapse. You can replace where mine says .show with .hide as well.
import wixData from ‘wix-data’;

$w.onReady( () =>
{ $w(“#dataset1”).onReady( () => {
let count = $w(“#dataset1”).getTotalCount();
if (count ===0) { $w(“#text194”).show();
$w(“#repeater1”).hide();
} else {
$w(“#text194”).hide();
$w(“#repeater1”).show();
}}
);
} );

1 Like
7

Thank You elizabethJhay and Roi,

Everything worked great, Thank You!

8

Over a year later, but thank you so much for this!!!

9

I’m trying to do the same, only I want to count element that have the same reference as the one displayed in a button, but it doesn’t work!

let count = $w("#dataset4").getTotalCount()
.hasAll("collection", $w("#button63").label);
if (count <=1) $w("#box47").collapse;

I first tried that :

wixData.query("goodies")
.hasAll("collection", $w("#button63").label)
.find()
.then( (results) => {
let numberOfItems = results.totalCount;
// hides the 'goodies smilaires' box if there are no results
if (numberOfItems <=1 ) $w("#box47").collapse;
});

Strange because I have a similar bit of code that works.

wixData.query("commentaires")
.contains("reference", $w('#input2').value)
.find()
.then( (results) => {
let numberOfItems = results.totalCount;
// set plural / singular versions of number of comments
if (numberOfItems <=1 ) $w("#text96").text = numberOfItems + ' COMMENTAIRE';
else $w("#text96").text = numberOfItems + ' COMMENTAIRES';
if (numberOfItems >=2 ) $w("#commentsDropdown").show();
if (numberOfItems >=20 ) $w("#pagination1").show;
});

The above code works.

Any idea why???

10

Make sure that your data set is ready. Check out the part of my script with OnReady text.

11

Also make sure you begin with
import wixData from ‘wix-data’;

12

@elizabethjhay Hi! Yes I have all of that in my code.