Hi
I have a table (from my data collection) displayed with options for user to filter the results based on date range. The table is connected to my collection and On Ready, it displays all rows by default. Then user can do a filter by entering “FromDate” and “ToDate” (both are date pickers); When user enters a date on either or both of these fields, "OnChange() function sets appropriate filters. All this works well.
I also have a button called “Reset Filters” which is meant to remove all filters which should display all rows (just as in On Ready). On my Reset_Btn_Click() function I have reset the FromDate and ToDate values to Null. But the table display is not changing; Can you please let me know what am I doing wrong;
Screen Shot On Read y
Screen Shot after applying filter and pressing Reset Filters button
Below is the full code
import wixData from ‘wix-data’;
import wixCrm from ‘wix-crm’;
$w.onReady( function () {
//TODO: write your page related code here…
console.log (“Start Date on Raedy =”+$w(‘#FromDate’))
console.log (“To Date on Raedy =”+$w(‘#ToDate’))
});
export function FromDate_change(event) {
//Add your code for this event here:
let realToDate = new Date($w(“#ToDate”).value);
if ($w(“#FromDate”).value !== null ) {
if ($w(“#ToDate”).value !== null ) {
realToDate.setDate(realToDate.getDate()+1)
$w(“#DLPClassRecordings”).setFilter( wixData.filter()
.between(“classDate”, $w(“#FromDate”).value, realToDate))
}
else {
$w(“#DLPClassRecordings”).setFilter( wixData.filter()
.ge(“classDate”, $w(“#FromDate”).value));
}
}
}
export function ToDate_change(event) {
//Add your code for this event here:
let realToDate = new Date($w(“#ToDate”).value)
realToDate.setDate(realToDate.getDate()+1) // add one day because .between(startDate, endDate) condition uses greater than equal for startDate, but only less than for endDate
console.log (“real To Date =”+realToDate)
if ($w(“#ToDate”).value !== null ) {
if ($w(“#FromDate”).value !== null ) {
$w(“#DLPClassRecordings”).setFilter( wixData.filter()
.between(“classDate”, $w(“#FromDate”).value, realToDate))
}
else {
$w(“#DLPClassRecordings”).setFilter( wixData.filter()
.le (“classDate”,realToDate));
}
}
}
export function ResetBtn_click_1(event) {
//Add your code for this event here:
console.log (“Pressed Reset Button”)
$w(“#FromDate”).value = null ;
$w(“#ToDate”).value = null ;
console.log (“Start Date after Reset =”+$w(‘#FromDate’))
console.log (“To Date after Reset =”+$w(‘#ToDate’))
FromDate_change(event);
ToDate_change(event);
}