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

How to change date calendar (nav) and scheduler (dp) according to data from database

Asked by Radamel Mirano
16 days ago.

From my question, I already develop a meeting room scheduler. The user that need to book meeting room should book it through the mobile apps. While admin will see either the meeting room available or not and can approve or reject it by using admin website.

When admin wants to view the booking details, the problem is the calendar and the scheduler always show the todays date and not the date that the user already booked.

Now, I want when admin want to view the booking details, the calendar and scheduler already shows the date based on the user already booked.

Can refer to my attachment

Answer posted by Dan Letecky [DayPilot]
8 days ago.

I assume that you have followed the calendar tutorial (https://code.daypilot.org/17910/html5-event-calendar-open-source) and have the navigator and calendar linked like this:

  nav.onTimeRangeSelected = function(args) {
      dp.startDate = args.day;
      dp.update();
      loadEvents();
  };

If you want to change the selected date you can call nav.select():
https://api.daypilot.org/daypilot-navigator-select/

nav.select("2019-09-13");

It will change the selected date in the DayPilot.Navigator (nav) and fire onTimeRangeSelected handler (above) that will update the DayPilot.Calendar (dp).

Comment posted by Radamel Mirano
5 days ago.

where did i need to put nav.select("2019-09-13");? Inside nav.onTimeRangeSelected = function(args) {}?

Comment posted by Radamel Mirano
5 days ago.

This is my current code

nav.onTimeRangeSelected = function(args) {
dp.startDate = args.day;
dp.update();
console.log(booked_id, Fac_ID, Room_Desc);
dp.events.load("backend/backend_events.php?Room_Desc="+Room_Desc+"&Fac_ID="+Fac_ID+"&booked_id="+booked_id);

};

nav.init();

New Reply
This reply is
Your name (optional):