Use Select Option to Filter on Date Ranges

In Filter on Date Ranges, the examples uses the pre-configured Date Range filter type limit records. But there’s another way to filter dates, one that allows the builder a fixed set of dates from a dropdown menu.

For example, what if a manager of the tech support team wanted to filter cases by the last time they were modified—that is, the last time anyone on the team worked with the case—based on a set of parameters:

  • Worked on today
  • Worked on this week
  • Worked on during the last week
  • Worked on sometime this month

To create this type of date filter, use a Select Option filter and standard date strings.

The goal? A filter that allows the user to select from a drop down of pre-selected date options.




The example below assumes a Skuid page with:

  • a functioning model on an object that collects information about potential leads (In this example, we used Salesforce’s Opportunity object).

  • a table on that model with fields for …

    • Name (of lead)
    • associated account (if any): AccountID
    • Amount
    • Created Date and Last Modified Date
    • Owner ID

If using a different data source, the field names indicated may be different.

Create model conditions [[]]

In the model, under Conditions, click fa-plus-circle to add a new condition and configure this condition for the start date of the first date range (e.g. $1,000):

  • Field: Use the Last Modified Date datetime field

  • Operator: =

  • Value: Leave blank

  • State:

    • Condition State: Filterable Default Off. (Skuid will automatically generate a name for the filter.)

Build the filter [[]]

On the Table component, click Add Features > Add Table Filter, then configure the filter:

  • Filter Type: Select Option
  • Filter Method: Server
  • Pick Options and Condition(s): Manually
  • Model Condition to Affect: The one created in the previous step
  • Show Label Above Filter: Yes, use Condition’s Field’s Label.
  • Create “None Selected” Option: Checked
  • “None Selected” Option Text: Last Input

Add the filter source

On the Last Input filter, click fa-plus-circle Add Option Source, then configure:

  • Source Type: Manual

Choose filter options

On the Source: Manual option source, click fa-plus-circle Add Option to create an option for the first choice to be listed in the filter:

  • What Conditions will this Option affect?: Affect the Default Condition.
  • Label: Today
  • Value: TODAY

Repeat the step above to add three addition Filter Options:

  • This Week (value string: THIS_WEEK)
  • Last Week (value string: LAST_WEEK)
  • This Month (value string: THIS_MONTH)

Learn more about Datetime formula functions.