search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

Display selected day in Navigator

Asked by Martin Smid
3 years ago.

Hi,

is there a way how to display currently selected day in navigator? Already we can see today highlighted, but I couldn't find API how to highlight selected day. It's useful with scheduler to give user reference where he currently is in navigator.

Answer posted by Dan Letecky [DayPilot]
3 years ago.

You can select a given day using .select() method:

<div id="nav"></div>
<script>
  var nav = DayPilot.Navigator("nav");
  // ...
  nav.init();

  nav.select("2017-03-13');
</script>

See also:
https://api.daypilot.org/daypilot-navigator-select/

By default, it will also automatically bring the target month into focus and call onTimeRangeSelect/ed events.

If you want to synchronize the selection with other navigation methods (e.g. previous/next buttons) I recommend using the navigator as the primary date source. The next/previous buttons would call nav.select(). That would subsequently update the Scheduler using DayPilot.Navigator.onTimeRangeSelected event handler.

Comment posted by Martin Smid
3 years ago.

Thank you for your answer.

I am aware of select() method and I use it, however Navigator doesn't visually distinct selected day in its view. I mean, I want to have this selected day highlighted (for example with darker background or so). Is this possible?

Comment posted by Dan Letecky [DayPilot]
3 years ago.

The selected days are marked with "navigator_default_cell" CSS class which uses a light-yellow backround in the default (built-in) CSS theme:

.navigator_default_select .navigator_default_cell_box {
 background-color: #FFE794; opacity: 0.5;
}

The following demo highlights the current week:
https://javascript.daypilot.org/demo/calendar/navigator.html

It looks like you might be using an older CSS theme version a custom CSS theme which isn't compatible with the latest version. You can create a custom theme in the theme designer:

https://themes.daypilot.org/navigator/create

The theme created using this tool is compatible with the latest DayPilot version.

Let me know if it didn't help.

Comment posted by Martin Smid
3 years ago.

Thank you very much, this actually helped me realize I had wrong selectMode (it was month and I wanted day).

I consider this topic resolved.

This question is more than 3 months old and has been closed. Please create a new question if you have anything to add.