Multiple filters not working with numbers or with date pickers

Ask the community
,
1

Hi all, I’m building a website with a page that allows multiple user input filters (search, dropdowns and for a database where the results display in a repeater. I’ve followed a tutorial that has helped me and I’ve managed to get search, topic and location filters working.

I have 3 questions:

  1. Why can’t I get any number based dropdown filters working e.g. cost or length of event (hours)?

  2. How can I get the date pickers to work in conjunction with all the other filters?

  3. How can I get the search bar to search for more than one database category?

I’ve popped the codes I’m using at the moment underneath.

Thanks so much in advance!!

import wixData from 'wix-data';

$w.onReady(() => {
    wixData.query('Topics')
        .find()
        .then(res => {
            let options = [{"value": '', 'label': 'All Topics'}];
            options.push(...res.items.map(topic => {
                return {'value': topic.title, 'label': topic.title};
            }));
            $w('#subject').options = options;
         })
         
    wixData.query('Locations')
        .find()
        .then(res => {
            let options = [{"value": '', 'label': 'All Locations'}];
            options.push(...res.items.map(location => {
                return {'value': location.title, 'label': location.title};
            }));
            $w('#location').options = options;
         })
               
let lastFilterSpeaker;
let lastFilterTopic;
let lastFilterLocation;
let lastFilterCost;
let debounceTimer;

export function input1_keyPress_1(event) {
    if (debounceTimer) {
        clearTimeout(debounceTimer);
        debounceTimer = undefined
    }
    debounceTimer = setTimeout(() => {
        filter($w('#input1').value, lastFilterTopic, lastFilterLocation,             lastFilterCost);
    }, 200)
}

function filter(speaker, topic, location, cost) {
    if (lastFilterSpeaker !== speaker || lastFilterTopic !== topic ||     lastFilterLocation !== location || lastFilterCost) {
    let newFilter = wixData.filter();
    
    if (speaker)
        newFilter = newFilter.contains('speaker', speaker);
    if (topic)
        newFilter = newFilter.eq('subject', topic);
    if (location)
        newFilter = newFilter.eq('location', location);
    if (cost)
        newFilter = newFilter.le('cost', cost);
        
$w('#dataset1').setFilter(newFilter);
    lastFilterSpeaker = speaker;
    lastFilterTopic = topic;
    lastFilterLocation = location;
    lastFilterCost = cost
    }
}

export function subject_change(event) {
    filter(lastFilterSpeaker, $w('#subject').value, lastFilterLocation, lastFilterCost);
}
export function location_change(event) {
    filter(lastFilterSpeaker, lastFilterTopic, $w('#location').value, lastFilterCost);
}
export function cost_change_1(event) {
    filter(lastFilterSpeaker, lastFilterTopic, lastFilterLocation, $w('#cost').value);
}


export function datePicker2_change(event,)  {

function pad(num, size) {
var s = num+"";
while (s.length < size) s = "0" + s;
return s;
}
const pickerDay = $w('#datePicker1').value.getDate().toLocaleString();
const pickerMonth = $w('#datePicker1').value.getMonth()+1;
const pickerYear = $w('#datePicker1').value.getFullYear().toString();
const pickerDateMin = new Date(pickerYear+"-"+pad(pickerMonth,2)+"-"+pad(pickerDay,2)+"T00:00:00.000Z");

const pickerDay2 = $w('#datePicker2').value.getDate().toLocaleString();
const pickerMonth2 = $w('#datePicker2').value.getMonth()+1;
const pickerYear2 = $w('#datePicker2').value.getFullYear().toString();
const pickerDateMax = new Date(pickerYear2+"-"+pad(pickerMonth2,2)+"-"+pad(pickerDay2,2)+"T23:59:59.999Z");

console.log(pickerDateMin, "end date");
console.log(pickerDateMax, "end date");

wixData.query("CPDCourses")
.ge("submissionTime", pickerDateMin)  //"2018-04-08T05:00:00.000Z"
.le("submissionTime", pickerDateMax)
.find()
.then( (results) => {

$w("#repeater1").data = results.items;
});
}