Custom Dates in Calendar

Problem

You want to set minDate to today’s date dynamically.

Solution

Use the Change node with JSONata expressions to set the dates.

Example

calendar-markup-nodes.png

[{"id":"d33e9f9e.ab0db","type":"markup","z":"a635abea.f55998","name":"Calendar","markup":"<TimelineMessage>\n  <Calendar\n    title=\"When would you like to set it?\" \n    minDate=\"${today}\"\n    maxDate=\"${nextWeek}\"/>\n</TimelineMessage>","markupType":"str","syntax":"markdown","x":660,"y":260,"wires":[[]]},{"id":"d99bcfdd.a7e52","type":"change","z":"a635abea.f55998","name":"Set Calendar Data","rules":[{"t":"set","p":"payload.user.today","pt":"msg","to":"$millis()","tot":"jsonata"},{"t":"set","p":"payload.oneDayInMs","pt":"msg","to":"1000 * 60 * 60 * 24","tot":"jsonata"},{"t":"set","p":"payload.user.nextWeek","pt":"msg","to":"$sum([$millis(), msg.payload.oneDayInMs * 7])\t","tot":"jsonata"}],"action":"","property":"","from":"","to":"","reg":false,"x":450,"y":260,"wires":[["d33e9f9e.ab0db"]]}]

To try it out simply copy the above json and import it in the flow designer.
Key shortcut Ctrl/⌘-i, Menu option Import

Discussion

Data setup

The Change node can be used to set properties of a message. Using JSONata expression you can set required timestamps: - $milis() Returns the number of milliseconds since the Unix Epoch - 1000 * 60 * 60 * 24 1000ms in 1s, 60s in 1m, 60m in 1h, 24h in 1 day. - $sum([$millis(), msg.payload.oneDayInMs * 7]) - sum of today’s Epoch and 7 days in milliseconds

set the properties to msg.payload.user.XXXX in order for us to be able to use them within markup.

Markup

<TimelineMessage>
  <Calendar
    title="When would you like to set it?" 
    minDate="${today}"
    maxDate="${nextWeek}"/>
</TimelineMessage>