Dataset not filtering and updating repeater on page

Ask the community
,
1

Hi.

I’m hoping some one can help me.

I’m new to Velo and am building my first web site in editorX.
On one of my pages I have a repeater that is connected to a dataset (dataset6) and displays photos.

Also on the page I have an input box (inputTitle) and a search button (buttonSearch) where I would like visitors to enter some search text and click the button.

The dataset should then be filtered by the text they entered and display any photos that have this text in its title (Title field).

From the console I get the following:

button clicked
Gallery
Line 8
Total photos:300
Gallery
Line 17
filtering dataset by title:moon
Gallery
Line 26
Total photos matching title search:300

So the button is definitely working, my search text is coming through, and I’ve got the right data set, but for some reason the data set isn’t being filtered as the number of records are are for all photos and repeater isn’t showing all the photos.

Any idea what I’m doing wrong?

Here’s my (very basic) code.

import wixData from 'wix-data';
$w.onReady(() => {
$w("#buttonSearch").onClick( (event) => {
console.log('button clicked');

let phototitle;
let numPhotos;
let ds=$w("#dataset6");
let totalPhotos;

totalPhotos=ds.getTotalCount();

console.log('Total photos:' + totalPhotos);

phototitle=$w('#inputTitle').value;

const searchFilter=wixData.filter() 
.contains("Title", phototitle);

        ds.setFilter(searchFilter);

        console.log('filtering dataset by title:' + phototitle)

        console.log('Total photos matching title search:' + totalPhotos);

} )

});

Many thanks

Mark

2

Mark, I’m not qualified to comment on your code; however, one thing jumps out at me: You are filtering on the field ‘Title’ – are you sure it’s not ‘title’, without the initial cap?

988×1040 47.5 KB

3

Eagle-eye → Jim Feuerstein!

Yes, good shot! It is right!
instead of…

.contains("Title",phototitle);

…using this one…

.contains("title", phototitle);

And about your statement…

I’m not qualified to comment on your code
We all were beginner, so do not hesitate to respond to questions. Even if you do mistakes, you also learn from mistakes → even more than going the normal way of learning, by just reading posts!

4

Thanks Jim and Velo-Ninja, it was just that. Thanks so much.

However, the photo count I’m returning to the console log is the full number of photos not the filtered number photos.

I moved the code:

totalPhotos = ds . getTotalCount ();

to after the filter code:

ds . setFilter ( searchFilter );

and the number of photos still doesn’t match the number of records found.

Any ideas?

Cheers

Mark

5

Try this one…

import wixData from 'wix-data';

$w.onReady(() => {
    let dataset="#dataset6";
    let numPhotos;
    let totalPhotos

    $w(dataset).onReady(()=>{
        $w("#buttonSearch").onClick((event)=>{console.log('button clicked');
            totalPhotos=$w(dataset).getTotalCount(); 
            console.log('Total photos:' + totalPhotos);
            let phototitle=$w('#inputTitle').value;
            const searchFilter=wixData.filter().contains("Title", phototitle);
            $w(dataset).setFilter(searchFilter);
            console.log('filtering dataset by title:' + phototitle)
            console.log('Total photos matching title search:' + totalPhotos);
        });
    });    
});

If my suggestion do not work, you will find and alternative solution here…

6

Thanks Velo-Ninja. I couldn’t get this to work.

Did you just add this code?

$w ( dataset ). onReady (() => {

Cheers

Mark