Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

I want to change date formate for Kendo ui Schedule at Header

$("#scheduler").kendoScheduler({
  date: new Date(),
  currentTimeMarker: false,
  views: [
    "day", "week", "workWeek"
  ]
});

like above code the default date formate in header will be MM/dd/yyyy but i need to modifiy that format.enter image description here

like image 832
Sonagara Hitesh Avatar asked Oct 07 '14 12:10

Sonagara Hitesh


People also ask

How do I change the date format in kendo?

Renders a general date/time pattern (long time) ( "M/d/yyyy h:mm:ss tt" for en-US). For example, kendo. toString(new Date(2000, 10, 6), "G") -> 11/6/2000 12:00:00 AM . Render a month/day pattern ( "MMMM dd" for en-US).

What is Kendo UI widgets?

Kendo UI is a comprehensive HTML5 user interface framework for building interactive and high-performance websites and applications. It comes with a library of 110+ UI widgets, an abundance of data-visualization gadgets, client-side data source, and a built-in MVVM (Model-View-ViewModel) library.


1 Answers

We can modify code as following.

$("#scheduler").kendoScheduler({
    date: new Date("2013/6/13"),
    startTime: new Date("2013/6/13 7:00"),
    height: 400,
    timezone: "Etc/UTC",
    views: [`enter code here`
        "day",
        { 
          type: "week", 
          selected: true, 
          dateHeaderTemplate: "<span class='k-link k-nav-day'>#=kendo.toString(date, 'ddd dd/M')#</span>"
        },
        "month",
        "agenda"
    ],

and in the asp.net MVC we can use

.Views(views =>
  {
      views.DayView(d => d.DateHeaderTemplate("<span class='k-link k-nav-day'>#=kendo.toString(date, 'ddd dd/M')#</span>"));
      views.WeekView(w => w.DateHeaderTemplate("<span class='k-link k-nav-day'>#=kendo.toString(date, 'ddd dd/M')#</span>"));
      views.MonthView();`enter code here`
      views.AgendaView();
  })
like image 130
Sonagara Hitesh Avatar answered Oct 11 '22 08:10

Sonagara Hitesh