jQuery Date Filter is a tiny library that does one thing; filter content by current date. This is useful for static sites generated by Jekyll where time based content isn’t removed until the site is rebuilt. I use jQuery Date Filter on the homepage of this site to hide past events (upcoming gigs). Now I don’t have to rebuild my site to remove a past event!

Download

Download jQuery Date Filter

How to use

Add a “data-date-filter” attribute to any element with the value set as a date:

  
    <li data-date-filter="{{post.date}}">
  

The date format expected is a datetime which Jekyll will output by default.

Then call the library like so:

  $('li').dateFilter();

If an item’s date is in the past then this item will be removed from the DOM. By default a buffer of 1 day is removed from the cutoff date, so an event starting at 0:00 today wont be removed until 0:00 tomorrow.

Configuration options

Name Default value Description
cutoff Current datetime Remove item(s) after this date.
buffer -1 Days to decrease or increase cutoff by.
emptyText Sorry, no results. Text to show when there are no items.