The date picker component can display week numbers on the left side of the week rows:

navigator date picker week numbers

The week numbers are disabled by default. You can enable the week numbers using showWeekNumbers property.

There are two methods for calculating the week number:

  • ISO 8601 (Monday is the first day of week; the week that includes the first Thursday of January is the first week of year)
  • US (Sunday is the first day of week; the week that includes the January 1 is the first day of year) 

You can choose the algorithm by setting the weekNumberAlgorithm:

  • "US" - uses the US method
  • "ISO8601" - uses the ISO method
  • "Auto" - uses "ISO8601" if the first day of week is Monday, otherwise it uses "US"

JavaScript Example

In the JavaScript date picker, use the showWeekNumbers and weekNumberAlgorithm properties to configure the week numbers:

<div id="nav"></div>

<script>

  const nav = new DayPilot.Navigator("nav", {
    // ...
    showWeekNumbers: true,
    weekNumberAlgorithm: "Auto"
  });

  nav.init();

</script>