multiDatePickDates
Select Multiple Dates in Salesforce Flows and Lightning Pages. The core date selection component — click, drag, or use recurring patterns to pick dates.
Overview
multiDatePickDates is the core date selection component. It gives your users a full calendar interface where they can click individual dates, drag to select ranges, or use recurring patterns to select multiple dates at once. It works in Salesforce Screen Flows (outputting dates to Flow variables) and on Lightning Record Pages (saving dates as related records automatically).
On This Page
⚡ Lightning Page Instructions
What You Need First
Create a dedicated child object to store selected dates. It only needs two custom fields — a Date field and a Lookup back to the parent record. For example, a Trip_Date__c object with these fields:
| Field | Type | Purpose |
|---|---|---|
Date__c | Date | Stores the selected date |
Trip__c | Lookup | Links back to the parent record |
{!recordId} is passed automatically on Record Pages — you don't need to wire it manually.Drop It In
Drag multiDatePickDates onto your Record Page in App Builder and configure these key properties:
relatedObjectApiName— API name of your date object, e.g.Trip_Date__cdateFieldApiName— the Date field on that object, e.g.Date__crelationshipFieldApiName— the Lookup field back to the parent, e.g.Trip__cshowInline— set to ON to show the calendar directly on the page (recommended)preloadExistingDates— set to ON to show previously saved dates when the page loadssaveButtonLabel— customize the save button text, e.g. "Save Dates"
What Comes Out
🔄 Flow Instructions
What You Need First
If you want the component to auto-save records, set up the same child object as the Record Page section above (Date field + Lookup). Then create a Flow variable to capture the selected dates:
| Variable Name | Type | Collection? | Notes |
|---|---|---|---|
{!selectedDates} | Text | Yes | Captures all selected dates as ISO strings |
{!dateRangesJson} | Text | No | Optional — for grouped date ranges via MultiDatePickParser |
Drop It In
Add a Screen element in Flow Builder, drag multiDatePickDates onto it, and configure:
label— button text that opens the picker, e.g. "Choose Travel Dates"modalTitle— title at the top of the calendar modal, e.g. "Pick Your Dates"showInline— set to ON to embed the calendar directly in the screenrelatedObjectApiName— your date object, e.g.Trip_Date__c(for auto-save)dateFieldApiName— the Date field, e.g.Date__crelationshipFieldApiName— the Lookup field, e.g.Trip__cselectedDates(Output) — wire to your{!selectedDates}Text Collection variableoutputAsJson— set to ON if you want grouped date ranges, then wireselectedDateRangesJsonto{!dateRangesJson}
What Comes Out
{!selectedDates} holds an array like ["2026-07-10", "2026-07-14"] — loop through it for additional logic. If you configured the Related Object fields, the component also auto-saves one record per date. For grouped ranges, turn on JSON output and feed {!dateRangesJson} to the MultiDatePickParser invocable action to get loopable fromDate/toDate entries.All Properties Reference
Display Properties
| Property | Type | Default | Description |
|---|---|---|---|
label | String | Select Dates | Text shown on the button that opens the date picker. |
modalTitle | String | Select Dates | Title displayed at the top of the calendar modal. |
showInline | Boolean | false | When ON, the calendar is always visible without needing to click a button. |
singleMonthView | Boolean | false | When ON, shows only one month at a time instead of two side-by-side. |
calendarSize | String | medium | Controls calendar size: 'small', 'medium', or 'large'. |
abbreviateDayHeaders | Boolean | false | When ON, shows single-letter day headers (S M T W T F S). |
weekStartsOnMonday | Boolean | false | When ON, the calendar week begins on Monday. |
showRecurringPattern | Boolean | true | When ON, shows the 'Add Recurring Pattern' button. |
showSelectedSummary | Boolean | true | When ON, displays a summary showing how many dates are selected. |
showDoneButtonInline | Boolean | true | When ON, shows a Done button that collapses the calendar to a summary. |
Constraint Properties
| Property | Type | Default | Description |
|---|---|---|---|
maxSelections | Integer | 0 | Maximum dates a user can select. 0 = unlimited. |
allowPastDates | Boolean | true | When OFF, only today and future dates are selectable. |
minDate | Date | — | Earliest selectable date. |
maxDate | Date | — | Latest selectable date. |
defaultDates | String[] | — | Pre-selected dates in ISO format (YYYY-MM-DD). |
disabledDates | String[] | — | Dates that cannot be selected (shown greyed out). |
availableDates | String[] | — | Only these dates are selectable; all others are disabled. |
autoJumpToFirstAvailable | Boolean | false | When ON with Available Dates set, opens to the month of the first available date. |
Output Controls
| Property | Type | Default | Description |
|---|---|---|---|
outputAsJson | Boolean | false | When ON, populates Date Ranges JSON Output with consecutive dates grouped together. |
Output Properties (Read-Only)
| Property | Type | Description |
|---|---|---|
selectedDates | String[] | Array of all selected dates in ISO format. |
selectedDateRangesJson | String | JSON string of consecutive dates grouped into ranges. Only populated when outputAsJson is ON. |
Record Page Auto-Save Properties
| Property | Type | Default | Description |
|---|---|---|---|
saveButtonLabel | String | Save | Text on the save button. |
relatedObjectApiName | String | — | API name of the object where each selected date is saved as a record. |
dateFieldApiName | String | — | API name of the Date field on the related object. |
relationshipFieldApiName | String | — | API name of the lookup field that links back to the current record. |
preloadExistingDates | Boolean | false | When ON, queries existing related date records and shows them in the calendar. |
preloadMode | String | editable | 'editable' or 'readonly'. Controls how existing dates appear. |
blockedDatesSourceObject | String | — | API name of an object to query for dates that should be blocked. |
blockedDatesDateField | String | — | Date field on the blocked dates object. |
blockedDatesFilterField | String | — | Optional lookup field on the blocked object to filter by current record. |
