How to make a reset button that works for 3 dropdowns and a search box?

Hi all,
I’m working on a fun sample website just to get a better understanding of WiX data, which I hope to later apply to actual websites.

I’m not having any trouble filtering the repeater with dropdowns or the search box, until I use the reset button I made for clearing the filters. The search box continues to work, but the dropdowns do not work after hitting the reset button. The repeater shows nothing as filtered after hitting the reset button, but using the dropdowns doesn’t work.

I used the filter settings under the dataset for filtering the dropdowns and a bit of code for the search box.

Here is what I have thus far. Any suggestions?

info89823.wixsite.com/starwars

Dropdowns - dropdownspecies, dropdownplanet, dropdowngender
Search Box - input1
Repeater- listrepeater
Reset Button - resetbutton
Search Button - button2
Dataset - dataset1

Code:

export function dropdownspecies_click(event) {$w( ‘#resetbutton’ ).show()
$w( ‘#lightsaber’ ).hide();

}

export function dropdownplanet_click(event) {$w( ‘#resetbutton’ ).show()
$w( ‘#lightsaber’ ).hide()

}

export function dropdowngender_click(event) {$w( ‘#resetbutton’ ).show()
$w( ‘#lightsaber’ ).hide()

}

import wixData from “wix-data” ;

let debounceTimer;

export function button2_click_1(event) {

if (debounceTimer) {

    clearTimeout(debounceTimer); 

    debounceTimer =  **undefined** ; 

} 

debounceTimer = setTimeout(() => { 

    filter($w( "#input1" ).value); 

},  200 ); 

}

let lastFilterSearch;

function filter(search) {

if (lastFilterSearch !== search) {

    $w( "#dataset1" ).setFilter(wixData.filter().contains( 'name' , search)); 

    lastFilterSearch = search; 
} 

}

export function resetbutton_click(event, $w) {
$w( ‘#lightsaber’ ).show( “turn” )
$w( ‘#resetbutton’ ).hide()
$w( ‘#dropdownspecies’ ).selectedIndex = 0
$w( ‘#dropdownplanet’ ).selectedIndex = 0
$w( ‘#dropdowngender’ ).selectedIndex = 0
$w( “#dataset1” ).setFilter(wixData.filter());

Take a look onto this post here, and you will learn how to work with FILTER-ENGINES.

Interesting parts for you …(DD = DropDown)

$w('#DD1, #DD2').onChange(()=>{SEARCH_ENGINE();});
functionRESET(){
    $w("#DD1").selectedIndex = undefined;
    $w("#DD2").selectedIndex = undefined;
    $w('#CB1').value = undefined;
    $w('#CB2').value = undefined;
}

Hi russian-dima, I appreciate your response but I don’t see a link to a post you mentioned.

Holly shit! :rofl:
SOOOORRYYYYY! I forgot to insert the right link…

Take a look here… (it is a parallel running thread) which could help you out…
https://www.wix.com/velo/forum/coding-with-velo/want-to-call-multiple-items-from-database-according-to-user-selection-can-you-help

Or you can start here…
https://www.media-junkie.com/pflegeservice

To see what is possible, you can take a look here…
https://www.media-junkie.com/rd-database-manager

A → How2, you will find here…
https://www.wix.com/velo/forum/coding-with-velo/want-to-call-multiple-items-from-database-according-to-user-selection-can-you-help

All informations about my RD-Data-Manager, you will find in all the numerous posts, related to this topic.

If all that stuff is to complicated for you, then take a look here…
https://russian-dima.wixsite.com/meinewebsite/blank-3
But this one is a very old example and surely not of best quality :grin:

Tell me if you could find your solution at the end.
And do not forget to like it, if you really liked it :wink:

Good luck & happy coding.