[英]Fullcalendar - How to add time of the day in week view
Default weekview is like this one, no time of the day on left side: 默认周视图是这样的,左侧一天中没有时间:
http://fullcalendar.io/views/basicWeek/ http://fullcalendar.io/views/basicWeek/
but I'd like to make the view this way, with time of the day on left side: 但我想以这种方式制作视图,并将一天中的时间放在左侧:
http://fullcalendar.io/js/fullcalendar-2.3.1/demos/agenda-views.html http://fullcalendar.io/js/fullcalendar-2.3.1/demos/agenda-views.html
click 'week' on upper button panel to see it. 点击上方按钮面板上的“星期”即可查看。
How do I configure it to make it looks like this way? 如何配置使其看起来像这样?
Thanks! 谢谢!
You want to use the defaultView
property. 您要使用
defaultView
属性。 This sets, as specified in the docs , the initial view when the calendar loads. 如docs中所指定的,这将设置日历加载时的初始视图。 The specific view you want is
agendaWeek
( list of available views ). 您想要的特定视图是
agendaWeek
( 可用视图列表 )。
So when you initialize your calendar, you'll put defaultView: 'agendaWeek'
. 因此,当您初始化日历时,将放置
defaultView: 'agendaWeek'
。
Example: 例:
$('#fullCal').fullCalendar({ events: [{ title: 'Random Event 1', start: moment().add(-4, 'h'), end: moment().add(-2, 'h'), allDay: false }, { title: 'Random Event 2', start: moment().add(1, 'h'), end: moment().add(2, 'h'), allDay: false }, { title: 'Random Event 3', start: moment().add(6, 'h'), end: moment().add(8, 'h'), allDay: false }], header: { left: '', center: 'prev title next today', right: '' }, timezone: 'local', defaultView: 'agendaWeek' /* this is the line you need */ });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.3/moment.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.1.1/fullcalendar.min.css" rel="stylesheet" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/2.1.1/fullcalendar.min.js"></script> <div id="fullCal"></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.