Kendo UI（计划程序） - 在标题中仅显示日期名称（例如：星期二）而不是完整日期

Question

我正在使用Kendo UI - 计划程序（议程和月份）

在议程中，我想只显示日期名称（星期日）而不是完整日期。

由于我是编码新手，我们非常感谢您的帮助。

  

Online Demo

图片参考：

$(document).ready(function() {

var _data = new kendo.data.SchedulerDataSource({
    data: [
      {
      eventID: 1,
      title: "Group meeting.",
      start: new Date(),
      end: new Date(),
      description: "Take my brother to his group meeting.",
      },
    ],

    schema: {
      model : { id : "eventID" }
    }

  });

  function save(){
    console.log(_data);    
  }

  $('#socialMediaCalendar').kendoScheduler({
    date: new Date(),
    //startTime: new Date(),
    height: 600,
    views: [
      { type: "agenda", title: "Agenda", selected: true },
      { type: "month" },
    ],

    save: save,
    dataSource:_data
  });

  $(function () {
    $("#socialMediaCalendar").kendoTooltip({
      filter: ".k-event",
      position: "top",
      width: 250,
      content: kendo.template($('#calendarPopupTemplate').html())
    });
  });

});

<div class="rp-calendar">
  <div id="socialMediaCalendar"></div>
</div>

<script id="calendarPopupTemplate" type="text/x-kendo-template"> 
    #var uid = target.attr("data-uid");#
    #var scheduler = target.closest("[data-role=scheduler]").data("kendoScheduler");#
    #var model = scheduler.occurrenceByUid(uid);#

    #if(model) {#
        <strong>event start:</strong> #=kendo.format('{0:d}',model.start)#<br />
        <strong>event end:</strong> #=kendo.format('{0:d}',model.end)#<br />
        <strong>event description:</strong> #=model.description#<br />
    #} else {#
        <strong>No event data is available</strong>
    #}#
</script>

Answer 1

您可以通过在视图选项中设置selectedDateFormat属性来指定视图日期的格式。

views: [
  { type: "agenda", title: "Agenda", selected: true, selectedDateFormat: "{0:dddd}" },
  { type: "month" },
]

{0:[some format]}将格式化视图开始日期，{1:[some format]}将格式化视图结束日期。

例如

{0:dddd}将生成字符串

  

星期日

和"{0:dddd, MMM dd, yyyy} - {1:dddd, MMM dd,yyyy}"将生成字符串

  

2015年12月13日（星期日） - 2015年12月19日（星期六）

有关详细信息，请参阅此处http://docs.telerik.com/kendo-ui/api/javascript/ui/scheduler#configuration-views.selectedDateFormat