How to create a search database with three fields

atelierinformatique · October 30, 2018, 7:43pm

Hello,
On a test website for the moment I have a page where a table displays the data of a little database with ten companies for example and for the dropdown by list two another “databases”, for the city and the activity…
I was inspired by this tutorial:
https://www.wix.com/code/home/forum/wix-tips-and-updates/how-to-create-a-search-for-your-database
That works well for the list.

a search by keyword, it’s ok.

I have a search field by activity, it works too.

But the third field, search by city, doesn’t work :

I see that the research is done by activity but I do not know why.
I do not know how to code correctly …

import wixData from “wix-data”;
/* - Ok - field search by keyword with timing */
export function formBusiness_keyPress(event, $w) {
if (debounceTimer) {
```
clearTimeout(debounceTimer); 
```
```
debounceTimer = undefined; 
```
}
debounceTimer = setTimeout(() => {
filter($w(‘#formBusiness’).value, lastFilterCompagnyName);
}, 500);
}
/* - Ok - */
$w.onReady(() => {
loadListCity();loadListActivity();
});
let lastFilterCompanyName; /* for the search by keywords*/
let lastFilterActivity; /Activity = field in the database for all activities : ListActivity/*/
let lastFilterActivity2; /Activity2 = field in the company database : ListCompany/
let lastFilterCity; /City = field in the database for all the city : ListCity/
let lastFilterCity2; /field in the company database/
let debounceTimer;
/* */
export function formActivity_change(event, $w) {
filter(lastFilterActivity, $w(‘#formActivity’).value);
}
export function formCity_change(event, $w) {
filter(lastFilterCity, $w(‘#formCity’).value);
}
/* -Ok - for the dropdown list with city*/
function loadListCity() {
wixData.query(‘ListCity’)
.find()
.then(res => {

 let options = [{"value": '', "label": 'All city'}];

 options.push(...res.items.map(city2 => {

 	return {"value": city2.city, "label": city2.city};

```
 })); 
```
```
 $w('#formCity').options = options; 
```
});
}
/* -Ok - for the dropdown list with Activity*/
function loadListActivity() {
wixData.query(‘Activity’)
.find()
.then(res => {

 let options = [{"value": '', "label": 'Tous activitys'}];

 options.push(...res.items.map(activity2 => {

 	return {"value": activity2.activity, "label": activity2.activity};

```
 })); 
```

 $w('#formActivity').options = options;

});
}
/* the filters… */
function filter(companyName, activity, activity2, city, city2) {
if (lastFilterCompagnyName !== compagnyName || lastFilterActivity !== activity || lastFilterActivity2 !== activity2 || lastFilterCity !== city || lastFilterCity2 !== city2)
{
```
let newFilter = wixData.filter(); 
```
```
/* - Ok - search by keyword */ 
```
```
  if (companyName) 
```

  newFilter = newFilter.contains('compagnyName', compagnyName)

/* - Ok - dropdown list search by activity */
if (activity2)

  newFilter = newFilter.contains('activity2', activity2);

 /* - Not work - dropdown list search by city...*/

```
if (city2) 
```

  newFilter = newFilter.contains('city2', city2);

/* #ListCompany name of the connexion between the database and the page*/

$w('#ListCompany').setFilter(newFilter);

```
lastFilterCompanyName = companyName;	 
```
```
lastFilterActivity = activity; 
```
```
lastFilterActivity2 = activity2;  
```
```
lastFilterCity = city; 
```
```
lastFilterCity2 = city2; 
```
```
 }    
```
}

Could you give me some hints please?
thank you
Have a goo day
Florent

yisrael-wix · October 31, 2018, 10:57am

Please post the editor URL of your site. Only authorized Wix personnel can get access to your site in the editor.

atelierinformatique · November 1, 2018, 10:04am

Hello,

after a few more tries, now the activity field does not work anymore and the search by keyword has problems : the list disappears…
Thank for your help.
Have a good day

yisrael-wix · November 1, 2018, 10:35am

Your filter() function has 5 parameters defined:

function filter(companyName, activity, activity2, city, city2)

However, you are calling filter() with only two parameters:

filter($w('#formBusiness').value, lastFilterCompanyName);
filter(lastFilterActivity, $w('#formActivity').value);
filter(lastFilterCity, $w('#formCity').value);

You need to call the filter function with all 5 parameters. Otherwise, the values of the parameters are not properly defined and the filter of the collection will not work.

You should refer to the Example: Search a Database to see how to properly handle the filter parameters.

atelierinformatique · November 2, 2018, 11:57pm

Hello,
Thank for the example. Now it’s ok for the search by keywords and by activity. It’s work properly.
But I have always a “bug” with the search by city : when I choose one of the city like “Bret” or another in the dropdown list, I see he try to find by activity as if there was only this filter…

What’s wrong with the filter ?
Thank
Have a good day
https://atelierinformatiqu8.wixsite.com/website-4

yisrael-wix · November 5, 2018, 8:50am

You are still not using the correct parameters for the filter() function.

Please understand that if you are going to work with code, you will need to familiarize yourself with basic coding concepts to accomplish what you want. There are a wealth of Javascript coding sites which will help you learn Javascript from basic to advanced - Javascript.info is a good one. You might want to refer to this discussion on functions .

Good luck

atelierinformatique · November 7, 2018, 10:04pm

Hello,
" You are still not using the correct parameters for the filter() function . "
… I am not a developer but after multiple trials and errors I managed to add the search field by city.
Finally…
Thank

import wixData from “wix-data”;

$w.onReady(() => {
loadListActivities(); loadListCities();
});

/=== Filters===/
let FilterActivities;
let FilterActivity
let FilterCity;
let FilterCities;
let debounceTimer;

/* for search by keyword with timing */
export function formBusiness_keyPress(event, $w) {
if (debounceTimer) {
clearTimeout(debounceTimer);
debounceTimer = undefined;
}
debounceTimer = setTimeout(() => {
filter($w(‘#formBusiness’).value, FilterActivity);
}, 500);
}

/===== export function ====/
export function formActivity_change(event, $w) {
filter(FilterActivities, $w(‘#formActivity’).value);
}
export function formCity_change(event, $w) {
filter2(FilterCities, $w(‘#formCity’).value);
}

/===== export function ====/

/* ===the filters… ===/
function filter(activities, activity) {
if (FilterActivities !== activities || FilterActivity !== activity)
{
let newFilter = wixData.filter();
/ - Ok - search by keyword /
if (activities)
newFilter = newFilter.contains(‘companyName’, activities);
/ - Ok - dropdown list search by activity */
if (activity)
newFilter = newFilter.contains(‘activity’, activity);

/* #ListCompany name of the connexion between the database and the page*/
$w(‘#ListAllCompanies’).setFilter(newFilter);
FilterActivity = activity;
FilterActivities = activities;
}
}

function filter2(city, cities) {
if (FilterCity !== city || FilterCities !== cities)
{
let newFilter2 = wixData.filter();
if (cities)
newFilter2 = newFilter2.contains(‘city’, cities);

/* ===#ListCompany name of the connexion between the database and the page===*/
$w(‘#ListAllCompanies’).setFilter(newFilter2);
FilterCity = city;
FilterCities = cities;

}

//=====fonction list ====//

/* -Ok - for the dropdown list with Activity*/
function loadListActivities() {
wixData.query(‘ListActivities’)
.find()
.then(res => {
let options = [{“value”: ‘’, “label”: ‘All activities’}];
options.push(…res.items.map(activity => {
return {“value”: activity.activities, “label”: activity.activities};
}));
$w(‘#formActivity’).options = options;
});
}

/* -Ok - for the dropdown list with city*/
function loadListCities() {
wixData.query(‘ListCities’)
.find()
.then(res => {
let options = [{“value”: ‘’, “label”: ‘All cities’}];
options.push(…res.items.map(city => {
return {“value”: city.cities, “label”: city.cities};
}));
$w(‘#formCity’).options = options;
});
}
//=====fonction list ====//

Topic		Replies	Views
"Search broken" - search more than one field in database Ask the community code , question	2	136	October 16, 2019
Keyword search for multiple fields Ask the community code , question	2	181	December 1, 2019
How can I filter multiple fields in a database Ask the community code , question	3	1198	February 6, 2019
Multiple text field and dropdown search Ask the community code , question	2	122	December 1, 2019
Search a Database: w/ 3 dropdowns and search input?! Ask the community code , question	2	111	September 17, 2020

How to create a search database with three fields

Related topics