Date Range Filter Issue

zgoforth

I guess long posts go unanswered. I'll make this one short and to the point. Here is my static data datatable: https://jsfiddle.net/rnoLja1v/5/

Since I am dealing with dates, specifically Sunday through Friday I want to filter the table to only show people in the current week, so I came up with this snippet to create some variables to get the current Monday and current Friday as well as format it how the table is formatting it with moment.

var now = moment();
var sunday = now.clone().weekday(0);
var friday = now.clone().weekday(5);
 
let sundayF = sunday.format('MM/DD/YYYY');
let fridayF = friday.format('MM/DD/YYYY');
 
console.log(sundayF); //output (as of today) "04/19/2021"
console.log(fridayF); //output (as of today) "04/23/2021"

I came across https://datatables.net/plug-ins/filtering/row-based/range_dates, but when I look at the example it doesn't make much since to me, although I do see that the plug in is accessible through a CDN which is nice

In my example I just updated it to include three dates that are within the current week range, and one that is two weeks away out of the range to make sure the example works.

From my understanding of the plugin, this is how it would work in my head (going off of my sundayF & fridayF values):
This is the initialization, then when it sets the declared variables to a substring, that is where I get lost, because there are completely different column values with no table to demonstrate.

At the beginning of the array of functions, there are a few variables declared,

 var iFini = document.getElementById('sundayF').value;
        var iFfin = document.getElementById('fridayF').value;
        var iStartDateCol = 4;
        var iEndDateCol = 12;

I understand those variables, and those are the column numbers of the Sunday and Friday dates that I want to represent the range, then there are a bunch of other (6,10) column values like that which have no visual representation or explanation anywhere on the page, so I am very confused. The only examples I can find include 1-2 search boxes to search for a range. I want my to only show the range, which is technically equal to current week

colin

It's probably unanswered because it's a big question that would take a lot of time to respond to. We reply to specific questions of usage, not design based questions or assistance in developing a site.

We do provide professional support services, the options are listed here. Hope that helps,

Colin

allan

I'd suggest you ignore that plug-in. You are already 50% of the way there with your logic at the the top of the post. All you need to add is a custom filtering function, from which you will get the data for each row passed in, and use moment to compare the values.

Use this page in the manual for details on how to write a custom plug-in.

Regarding the unanswered question - we only have a finite amount of time to answer questions so we prioritise in this order:

• Customers who have purchase a support package as Colin linked to
• Customers with Editor licenses
• Customers who have purchased a supporter package
• Everyone else.

That's on top of maintaining the software, developing new features and so on. Unfortunately, sometimes we just don't have time to answer every question. We do try though (and the community here is awesome - big shout out to Kevin in that regard!) .

Allan

zgoforth

@allan Thanks for the response, I have been busy building another DataTable for a different application, I absolutely love DataTables. Thank you for sharing that link, I will work on creating my own plugin!

zgoforth

@allan in regards to that, a supporter package, if I were to purchase the Medio package, would that fall under that? Been seriously thinking about it, as DataTables is a huge part of what I do.

Second, I have been working on the plugin, but the examples use input values to search/filter and I want the table to do it on its own.

I inserted the following at the top of my $(document).ready(function () and I thought it didn't work at first because it said "No matching records found", but then I realized all the data I was pulling had dates from the beginning of the month. I made a new list item with and it worked!

        $.fn.dataTable.ext.search.push(
    function( settings, searchData, index, rowData, counter ) {
        var now = moment();
        var sunday = now.clone().weekday(0);
        var friday = now.clone().weekday(5);
        
        let sundayF = sunday.format('MM/DD/YYYY');
        let fridayF = friday.format('MM/DD/YYYY');
        
        console.log(sundayF); 
        console.log(fridayF);
        
        var sSunday = searchData[3];
        var sFriday = searchData[12];
        
        if (sundayF == sSunday && fridayF == sFriday) {
            return true;
        }
        return false;
    }
);

allan

The supporter packages aren't actually support packages, but rather a way of saying "thanks for the free software - have a coffee / beer". Our support packages are here.

I made a new list item with and it worked!

Awesome! So just to confirm, your plug-in is doing what you need now?

Thanks,
Allan