How to Create a Search for Your Database

Show and tell
,
1

After a lot of requests, we are happy to post a new video of how to set up a search bar on your page.

You can find the video here - https://www.youtube.com/watch?v=Hx7_8-lRsW0&feature=youtu.be I

The full code from the video -

import wixData from "wix-data";

$w.onReady(() => {
  loadContinents();
});

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

export function iContinent_change(event, $w) {
	filter(lastFilterTitle, $w('#iContinent').value);
}

function filter(title, continent) {
  if (lastFilterTitle !== title || lastFilterContinent !== continent) {
    let newFilter = wixData.filter();
    if (title)
      newFilter = newFilter.contains('articleTitle', title);
    if (continent)
      newFilter = newFilter.contains('continent', continent);
    $w('#dataset1').setFilter(newFilter);		
    lastFilterTitle = title; 
    lastFilterContinent = continent;
  }
}

function loadContinents() {
  wixData.query('Continents')
	  .find()
	  .then(res => {
	  	let options = [{"value": '', "label": 'All Continents'}];
	  	options.push(...res.items.map(continent => {
	  		return {"value": continent.title, "label": continent.title};
	  	}));
	  	$w('#iContinent').options = options;
	  });

}
21 Likes
2

thanks Yoav - what about code features to improve uploading time?
while you handling it through your system as a whole - now you can supply
ways to handle and improve uploading time with code.
this is crucial since it has an impact on Google SEO score and users experience…
just my 2 shekel :slight_smile:

3

I seriously just wachted this video yesterday and added search to a few places on my sight! THANK YOU!
It was perfect!

4

this video not shown which button used to create a search bar thats my problem the video started already search added help from scratch

5

Guys please it’s not working with code Nayeli gave me…

6

Thanks Yoav,
Very well explained, simple, clear and functional.
Now I know how to fix the flickering effect… Just brilliant!

More videos like this please :slight_smile:
-Luigi

7

great video

8

coding isnt my strength. i followed every step in the video but i still cant seem to figure it out. maybe there needs to be coding for dummies

9

what about one search box for 6 data collections?

10

Final question. Have everything working per your example. Thank you…The only issue now is how to eliminate duplicates in the drop down list? I have six entries in the database . Two for Europe, two for North America and two for Australasia. All three continents show up in the list twice? In the video this does not happen?

11

Hi,

how can filter my database by owner ID (_owner)?


I want to display the item with the same owner ID (_owner) in the repeater.

I hope someone can help me on this.

Thank you,
Geo

12

Geo … email me. nayeli@totallycodable.com

:slight_smile:

13

Need help with drop-down search. I now have loaded 8,000 records and really need this search to work. I have stretched WIX to its limit with many beta pieces due to the size of the data I am working with and the complexity of this new site. I started from knowing very little about WIX to falling in love with its ease of use. I have since created four sites that look beautiful and work well.

Please help!!!

14

Hey @billmacdonald, you can reach me at felipe@diaytech.com and I will gladly help you :slight_smile:

@Yoav the search function + dropdown integration video has been a great addition. Thank you!

15

A special thank you to Felipe Bustos for helping me solve my problem. WELL DONE!!!

16

I have made a search index function to index several data collections into one search results and the index will update automatically. Thanks for making Wix Code, it is awesome.

17

hi, where is available search bar to place above repeater?

18

I followed 100% step by step more than once and unfortunately we did not produce the same results as the tutorial.

I am ashamed of myself when I say that after the third attempt I copied the code and placed it in the “code for the page” and added the functions to the “applications”, including the creation of a “database” called “Continents”, as could be a name conflict in the “code” and the result was the same as following the tutorial step by step.

In short, I could not get it to work regardless of how it was used to play it.

the only error described was: “Parameter event 'is never used”. What I put in excluding the following excerpt from the code: “event, $ w”.

I just have a question, is the user input used for searching “input” or “text box”?

19

Vortex:
Input used for searchig is “Input”, not text box.

20

HI, does anyone know how I can create two enormously important features in a Property Page listing: one is an “ORDER BY”, as below,

and 2, “Favourite” button, so that when a property is checked it goes into a client’s favourite listing file??


If annyone has any ideas, it would very much be appreciated!

Thanx