How to hide a site collection from users?

Ask the community
,
1

Maybe my question is not the right one for what I have in my mind. That will be a cliché, but I am totally new to Wix coding. So, please bear with me, if you find it awkward.
I’m trying to make a site that includes some sort of search in a database. Unfortunately, all my search in the web was in vain, since all tutorials I found were about searching in or filtering from collections that are visible to users and then narrowing down the items according to some criteria defined by users.
What I need is to hide the whole collection and show only those that users search for them using an input box. The whole procedure should be like the experience which we have during the search with search engines or looking up a word in dictionaries.
It might be totally in the wrong direction, but all I have is the following code.

import wixData from 'wix-data';
$w.onReady(function () {
//TODO: write your page related code here...
});
export function input1_keyPress(event, $w) {
 //Add your code for this event here:
  let SearchValue = $w("#input1").value;
  $w("#dataset1").setFilter(wixData.filter().contains('entry', SearchValue))
}

How can I apply this searching or filtering approach?
In case of your need, the site can be found in the following address.
https://aybdihm.wixsite.com/tolearn1
The password is t/o/l/e/a/r/n/1, but without slashes.

2

I see what you mean. Try searching the Forum for “debounce”, you will find the answer.

3

Thank you for your reply.
I’m not sure why you suggested the ‘debounce’. According to what I found on the web and the forum, it is about putting some delay time to catch all characters from the input box and avoiding the flicker issue. It might be my next concern but not now.
I, however, made some changes in the code that include the debounce and then nothing happened. Here is the new code

import wixData from 'wix-data';

$w.onReady(function () {
	//TODO: write your page related code here...

});

let debounceTimer;
export function input1_keyPress(event, $w) {
   if (debounceTimer) {
      clearTimeout(debounceTimer);
      debounceTimer = undefined;
   }
	debounceTimer = setTimeout(() => {
        filter($w('#input1').value, );
    }, 500);
}

let lastFilterTitle;
function filter(entry) { 
	if (lastFilterTitle !==entry) {
		$w('#dataset1').setFilter(wixData.filter().contains('entry', entry));
		lastFilterTitle = entry;
}
}

Again, my problem is to hide all collection items, let say in the home page in the site, from users as they land on a given page. I mean, the stage before which users start to write in the input box. In this stage I don’t want users to see any item except the searching box.
Could you please give some specific clue? Should I use a different function of put some conditional ones in the export or other functions?

4

When you say hide your collection, what are you showing it as on your page, a table, repeater or something else?

To hide it from all users to begin with then just set it to be hidden on load or collapsed on load and then only to be shown when a user searches for something through your user input search box and make sure that you use the denounce option that Giri mentions already so that all the users inputs get recorded etc.

See this page for more info about collapsing a table before results are shown.
https://support.wix.com/en/article/corvid-tutorial-adding-collection-data-search-functionality

5

Thank you for your reply and the guide.
I use a Repeater for populating the items. I have already tried to hide or collapse the repeater using the “hidden on load” or “collapse on load” but it causes to hide the repeater even after writing text and pressing the input box. To show, I created a table linked to the collection data and set its hidden on load property to be true. Please note that the repeater in the pictures is not hidden. So the hidden table does not show up in the preview mode, but the repeater does.
Here are pictures showing the site in editor and preview modes

1427×680 153 KB

before searching

1598×768 94.6 KB

after pressing button

1599×768 63.9 KB

https://aybdihm.wixsite.com/tolearn1
The password is t/o/l/e/a/r/n/1, but without slashes.

import wixData from 'wix-data';
$w.onReady(function () {
//TODO: write your page related code here...
});

let debounceTimer;
export function input1_keyPress(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w('#input1').value, );
}, 900);
}
let lastFilterTitle;
function filter(entry) {
if (lastFilterTitle !== entry) {
$w('#dataset1').setFilter(wixData.filter().contains('entry', entry));
lastFilterTitle = entry;
}
if (lastFilterTitle === ''){
$w('#dataset1').setFilter(wixData.filter().eq('title','' ));
}
}
6

On top of Shans comment you want to add some code after the filter to show or expand the repeater again

Filter.then(() => {
$w(“#repeater”).expand() // or show()
})

Added into your code

import wixData from ‘wix-data’;
$w.onReady( function () {
//TODO: write your page related code here…
});

let debounceTimer;
export function input1_keyPress(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#input1’).value, );
}, 900);
}
let lastFilterTitle;
function filter(entry) {
if (lastFilterTitle !== entry) {
$w(‘#dataset1’).setFilter(wixData.filter().contains(‘entry’, entry)).then(() => {
$w(“#repeater”).expand()
lastFilterTitle = entry;
})
}
if (lastFilterTitle === ‘’){
$w(‘#dataset1’).setFilter(wixData.filter().eq(‘title’,‘’ )).then(() => {
$w(“#repeater”).expand()
})
}
}

7

Scott, thank you so much for your help. That works now. I also appreciate other community members for their guides.