Create a Date-Range Table Filter

Date Range Filters allow a user to narrow down the information on a table to a specific period of time. In this tutorial we will use the example of narrowing down Contacts by their birthdate. You can use any standard or custom date-time field here on a basic (but not aggregate) model.

Goal: Filter content in a table by a specific date range.

image0

Step 1: Create a Table

image1

For detailed instructions on building a table see the Table tutorial.

Step 2: Click Add Features > Add Table Filter.

image2

Step 3: Choose Date Range as the Filter Type.

image3

  1. Choose Date Range as the filter type.
  2. Choose to Auto Generate Conditions. (Isn’t Skuid nice? You can also create these conditions yourself if you prefer, scroll down for more instructions).
  3. Choose the Date/Date-time field you want to use.

Alternatively, you can choose “Specify Existing Conditions” as the Filter Source.

image4

  1. For Condition Source, choose Specify Existing Conditions.
  2. Choose model conditions to set the Begin Date and the End Date. (See below for an example of what these conditions can look like).

Create one condition for the Begin Date, and another for the End Date.

image5

In this step we will add Start and End Date conditions using the CreatedDate field. Go into your table model, and click on Conditions to add a condition.

  1. For field, choose CreatedDate or a custom picklist field on your object.
  2. For Operator choose “>=” (is greater than or equal to). This is saying that you want only show Contacts created on or after the date that you select.
  3. Don’t make any changes to value. You want to leave that blank so that the user can select the date themselves.
  4. Make sure the State is Filterable Default Off.The State property allows this condition to be modified by filters.

Repeat these steps to create an End Date Condition where Operator is “<=” (is less than or equal to).

Step 4: Click Save, then Preview to see your new filters in action.

image6

Success!

image7

You should have a working Date-Range filter! Enter the Start Date and End Date and click apply to filter your table. Whether you use used auto-generated conditions or ones that you created yourself, your filter will look the same.