How to Create a Search for Your Database

Matthew, order by filter arrangement and for the favorites you need to have a member profile page (there’s an other thread about this in the forum) and a collection to store and modify the favourites. You can shoot me an email if needed: felipe@diaytech.com

Thanks so much Felipe. It looks like we’ve ironed out these problems. Really appreciated!

I have 9700 products in my repeater. It takes about 45 seconds to open. Any ideas how I can speed it up?
https://planethost.wixsite.com/pmls/search2

Wayne,

You want to try hiding the repeater on load … then set timer to appear after a few seconds. Either way …each dataset has a limit to only show 1,000 …so I dont think your page is trying to load all 9700 products. It could just be trying to load the first 1000 or something else on the page.

If i were a customer on a page … I doubt I would make it to view all 1000 products. I would probably want to see some sort of either featured products and then sort/filter buttons to narrow down my search.

I have mirrored all steps written by YOAV’s video and code exaple, but finaly works only search bar. When I try to filter by dropdown, only one category in dropdown filtering products but others unfurtunately show nothing.
Please help!

Thanks Code Queen. That was my aim.
Even testing with the editor and the sandbox collection - it take ‘forever’!

I have managed to get it working 100% with a table. Something like this

Then how do I get a repeater doing the same thing ?

  1. Set the base of this table to show the entire search result instead of cutting it off?
  2. If I click on one of the images or a row… How do I get it to open on a new page with the entire supplier listing?

You are a star… Where did you learn javascript?

Thank you :slight_smile:

I learned right here in this forum by asking questions and using all the resources that Wix has. (Articles, Examples, API lists, videos …)

I have always loved logic and puzzles. Wix Code fit right in. It was love at first ‘site’ :wink:

Try playing around with the table settings for different viewing styles, etc. If you want them to click on a row to be redirected to another page — you need to build a dynamic single item page and then connect it using your table settings.

You can watch my repeater video here: How to use Wix Repeaters | Create Property Listing, Directory - YouTube

And if I may make a design suggestion … try making the background a lighter solid color … like white … or beige. This is especially important if you are building a website that gives all the attention to the products. You want the visitor’s attention on the product and not the background. The ‘fancier’ you get with colors … the more you lose their focus.

Thanx CQ. I agree. I found wix to be hugely powerful because its a WYSIWIG system. Most of the others are not. I really enjoy wix. Will look at your video shortly.

Its not working…
I have created a test site with the continent articles, images etc.
Then I built a repeater connecting it to the Articles dataset
I added the two search inputs and added their name ID’s
Copied the code Ctrl C + V into the page.

NOTHING…

You forgot to mention the dataset needs to be Read & Write or it will not function.

This is my result.
https://planethost.wixsite.com/testsite

These are the permissions - which no one ever mentions and is the main issue with many issues.

And the code

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(‘Articles’)
.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;
});

}

X
X
X
X
X
X
X

ERROR ins the code
It doesn’t work until

  	options.push(...res.items.map(continent => { 
  		return {"value": continent.title, "label": continent.title}; 

BECOMES

  	options.push(...res.items.map(continent => { 
  		return {"value": continent.continent, "label": continent.continent}; 

The learning curve is rediculously steep. Is there not a course on wix code somewhere???

So … i sincerely hope someone is able to give me the correct code.

Vortex…
I am reading the code above and comparing it to the code in the video. CHALK AND CHEESE.
There is nothing wrong with you or I.

I think those who get it right have changed the code somewhere. I just wish someone would post the correct code. I am wasting 6 hours of every day trying to work this out and it IS NOT WORKING!

Hi Nayeli,
I was following your video - YouTube
Firstly I cannot believe the steep learning curve we have with wix code. I sympathise with you fully.

Secondly, I followed your video and it made SO MUCH SENSE!
Please keep making videos of what you learn. It is really very beneficial to us.

I have been trying to add a Search input for my repeater… Im going mad trying to do this…

Well thank you :slight_smile:

It has been challenging but every day I learn more and more.

Maybe these notes might help you: Totally Codable - Trusted Velo Community

I have other code resources here: https://www.totallycodable.com/forum/codes-for-templates

And I invite you to join my FB group where you can post your questions to get insight from other wix users, experts and coders :slight_smile: . Totally Codable Community - Web Design, Wix, Velo, No Code and more . . . | Facebook

Still doesnt show “All continents” , when i try All continents in menu, doesnt show anything…

Hi Nayeli! I’ve been watching your videos on youtube, these are very helpful! Thank you! I’m not a code expert but i’m building a website and for this I need 3 search categories on my home page and filter these categories from a database and display them to an user. I read the tutorial " How to Use Code to Let Your Users Search a Collection " however I don’t know how to do this with two or more search criteria. Appreciate your suggestions!

Here is code I am using to import vehicle years from my Wheels2 dataset to a drop down (user input). It works except it doesn’t remove repeat values of vehicle years.

import wixData from “wix-data”;
$w.onReady(() => {
wixData.query(‘Wheels2’)
.ascending(‘vehyear’)
.limit(1000)
.find()
.then(res => {
let options = [{“value”: ‘’, ‘label’: ‘All Years’}];
options.push(…res.items.map(vehyear => {
return {‘value’: vehyear.title, ‘label’: vehyear.vehyear};
}));
$w(‘#iyear’).options = options;
});
});
let lastFilterTitle;
let lastFilterYear;
function filter(title, newyear) {
if (lastFilterTitle !== title || lastFilterYear !== newyear) {
let newFilter = wixData.filter();
if (title)
newFilter = newFilter.contains(‘title’, title);
if (newyear)
newFilter = newFilter.eq(‘vehyear’, newyear);
$w(‘#Wheels2’).setFilter(newFilter);
lastFilterTitle = title;
lastFilterYear = newyear;
}
}

export function iyear_change(event, $w) {
filter(lastFilterTitle, $w(‘#iyear’).value);
}

// vehyear is a field in my dataset
// title is my primary key
I know in the video the field continent had each continent more than once. If someone can explain to me why this isn’t working for me I would appreciate it. I believe it is because my 'function filter" isn’t being executed.

Greg

So I recently got this from Jeff from Wix from another forum post and I modified it to work with my dataset field years. However it only returns about 20 years from 1969 - 1988 vs 1969 - 2016. It seems that using an array here is limiting my returned filtered values where in my above code actually uses the parameter .limit(1000). Even thought I hadded .limit() in this code, but I believe the array is limiting here. Thoughts, anyone? Bueller?

import wixData from ‘wix-data’;

$w.onReady(function () {
wixData.query(“Wheels2”)
.limit(1000)
.ascending(‘vehyear’)
.find()
.then(results => {
const uniqueYears = getUniqueYears(results.items);
$w(“#iyear”).options = buildOptions(uniqueYears);
});

function getUniqueYears(items) {     
		const YearsOnly = items.map(item => item.vehyear);    
   		return [...new Set(YearsOnly)]; 

}

function buildOptions(Years) {    
	return Years.map(vehyear => { 
	return {label:vehyear, value:vehyear};   
	}); 
} 

});

I was wondering how to run two search boxes on a single page. Search by Industry and Search by Last Name. The Industry search works using the following code, but the lastName one does not. Any ideas?

import wixData from “wix-data”;

let lastFilterIndustry;
let lastFilterLastName;
let debounceTimer;
export function iIndustry_keyPress_1(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#iIndustry’).value);
}, 200);
}

export function iLastName_keyPress(event, $w) {
filter($w(‘#iLastName’).value);
}

function filter(industry, lastName) {
if (lastFilterIndustry !== industry || lastFilterLastName !== lastName) {
let newFilter = wixData.filter();
if (industry)
newFilter = newFilter.contains(‘industry’, industry);
if (lastName)
newFilter = newFilter.contains(‘lastName’, lastName);
$w(‘#dataset1’).setFilter(newFilter);
lastFilterIndustry = industry;
lastFilterLastName = lastName;
}

}

Hey WIll why dont just 1 searchbox and refine your filter with the or( ) function?

I agree with Felipe :wink:

Seems like you understand a bit of code … try this:

https://www.totallycodable.com/forum/codes-for-templates/search-this-or-that-code-repeater-results