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

Change Scheduler displayed Date format

Asked by Jeffrey
8 years ago.

In Scheduler, using the Hotel reservation template from the demo, the reservations have the displayed date format (along with the Create & Edit Start and End fields) set to yyyy-mm-dd = 2016-07-05.

How does one change it this to a preferred format such as dd-MMM-yyy = 05-Jul-2016

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

The MVC Hotel Reservation tutorial at https://code.daypilot.org/32389/asp-net-mvc-hotel-room-booking uses the following code to format the start and end date:

ReservationController.cs:

    public ActionResult Create()
    {
        return View(new 
        {
            Start = Convert.ToDateTime(Request.QueryString["start"]).ToShortDateString(),
            End = Convert.ToDateTime(Request.QueryString["end"]).ToShortDateString(),
            Resource = new SelectList(Db.GetRoomSelectList(), "Value", "Text", Request.QueryString["resource"])
        });
    }

It uses the default short date format string depending on the current culture, i.e. "M/d/yyyy" for "en-us.

A similar approach is used in Edit() method.

You can use ToString("dd-MMM-yyyy") instead of ToShortDateString() to use a specific format.

Comment posted by Jeffrey
8 years ago.

Hello & thanks for that, it worked.

However, always a however, this change sorted out the Create & Edit Views and I have also changed this to show dd-MMM-yy on the Select range when creating a new reservation:

function selecting(args) {
var duration = Math.floor(new DayPilot.TimeSpan(args.end.getTime() - args.start.getTime()).totalDays());
var s = duration > 1 ? "s" : "";

args.left.enabled = true;
//args.left.html = "Start:<br/>" + args.start.toString("M/d/yyyy");
args.left.html = "Start:<br/>" + args.start.toString("dd-MMM-yy");
args.right.enabled = true;
//args.right.html = "End:<br/>" + args.end.toString("M/d/yyyy") + "<br/>" + duration + " night" + s;
args.right.html = "End:<br/>" + args.end.toString("dd-MMM-yy") + "<br/>" + duration + " night" + s;
}

But the format yyyy-mm-dd still shows on the displayed reservations on the Scheduler. I have culture set to en-ca and went as far as changing DayPilot.Locale in daypilot-all.min.js, but to no avail.

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

The event text/HTML can be customized using OnBeforeEventRender method (see https://doc.daypilot.org/scheduler/event-customization/).

You will find it in SchedulerController.cs:

protected override void OnBeforeEventRender(BeforeEventRenderArgs e)
{
  e.Html = String.Format("{0} ({1:d} - {2:d})", e.Text, e.Start, e.End);
  // ...
}

To change the date format simply adjust the format string:

protected override void OnBeforeEventRender(BeforeEventRenderArgs e)
{
e.Html = String.Format("{0} ({1:d-MMM-yyyy} - {2:d-MMM-yyyy})", e.Text, e.Start, e.End);
// ...
}

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