Search / filter records on a Table linked to a DB collection


Hello,

I have the above table within one of the pages on my website mentioned above. This table is linked to a database collection ‘ProfileInfo’ at the back end, from which the data is populated in the table.

I was able to make the sort option work using the below code - the table data sorts based on any of the fields using the drop down box

export function dropdown1_change_1(event, $w) {
var val = event.target.value;
var dset = $w(“#dataset1”);
var fld;
switch (val) {
case “First Name”:
fld=“firstName”;
break ;
case “Last Name”:
fld = “lastName”;
break ;
case “Country”:
fld = “country”;
break ;
case “Family Line”:
fld = “familyLine Text”;
break ;
}
console.log("fld = " + fld);
switch (val) {
case “First Name”:
dset.setSort( wixData.sort().ascending(fld));
break ;
case “Last Name”:
dset.setSort( wixData.sort().ascending(fld));
break ;
case “Country”:
dset.setSort( wixData.sort().ascending(fld));
break ;
case “Family Line”:
dset.setSort( wixData.sort().ascending(fld));
break ;
}
}

Trouble with search option:
I created a text box that accepts a string to filter the table based on the First Name and a button ‘Search’ to filter the table based on the text field data. Although I do not get any errors for my code (below), the search / Filter option does not work on the live website.

Please review the below code and let me know what I’m doing wrong. Thanks
Note:
Name of text field that holds the search string - input1
Name of dataset - dataset1
name of the ‘Search’ button - button 48

export function button48_click (event, $w) {
let v = $w(‘#input1’);
$w(‘#dataset1’).setFilter( wixData.filter()
.contains(“firstName”, v)
.find()
.then( (results) => {
let items = results.items;
let firstItem = items[0];
let totalCount = results.totalCount;
let pageSize = results.pageSize;
let currentPage = results.currentPage;
let totalPages = results.totalPages;
let hasNext = results.hasNext();
let hasPrev = results.hasPrev();
let length = results.length;
let query = results.query;
} )
. catch ( (error) => {
let errorMsg = error.message;
let code = error.code;
} )
);}

Greetings,

Try syncing your sandbox (preview) database with your live one. You can find out how to do that - here .

Also you don’t need all that for the filtering code you can simply do:

export function button48_click (event, $w) {  
let v = $w('#input1'); 
$w('#dataset1').setFilter( wixData.filter().contains("firstName", v) .then(()=> {
    $w('#dataset1').refresh()
});

We set the filter then refresh the dataset to get the filtered data in the above code.

PS. The semi colon you have at the last line of your code should be at the end after the curly brackets.

Best,
Majd