完整日历时间间隔应为1小时,从6:30开始

帕迪普·辛格拉

我尝试了此实现“完整日历实现”

    $("#available_classes_calendar").fullCalendar({
        header: {
             left   : 'prev,next',
             center : 'title'
            },
        defaultView: 'agendaWeek',
        views:{
            agenda:{
                allDaySlot: false,
                minTime: "06:30:00",
                maxTime: "24:00:00",
                slotDuration: "00:60:00"
            }
        }
    });

在此全天列中,应从上午6:30开始,间隔时间应为1小时。

因此,全天列应如下所示:

上午6:30上午7:30上午8:30。晚上11:30

我尝试了很多解决方案,但无法实现这一目标。

请让我知道是否需要其他信息来解决此问题。

谢谢 @lucasnadalutti小提琴的屏幕截图

路易斯·克鲁兹

您的问题就是放置选项的地方。它应该是

$("#available_classes_calendar").fullCalendar({
    header: {
         left   : 'prev,next',
         center : 'title'
        },
    defaultView: 'agendaWeek',
    allDaySlot: false,
    minTime: "06:30:00",
    maxTime: "24:00:00",
    slotDuration: "06:00:01"
});

关于显示器06:3007:30等等,在纵轴上,你需要设置slotDuration: "06:30:01"看看这个jsfiddle

最重要的是要注意的01第二件事slotDuration没有这个,您将无法显示半小时。


关于为什么需要“ +01”秒的解释:

FullCalendar支持半小时或任何您想要的时间轴,但是您需要做一些古怪的事情。这背后的原因是源代码本身(查看FullCalendar 2.3.1的源代码),从5714行到5719行:

((!slotNormal || !minutes) ? // if irregular slot duration, or on the hour, then display the time
    '<span>' + // for matchCellWidths
        htmlEscape(slotDate.format(this.axisFormat)) +
    '</span>' :
    ''

现在,$slotNormal在5701行中定义它,并且是:

var slotNormal = this.slotDuration.asMinutes() % 15 === 0;

因此,如果您有30分钟的时段,则条件将为false,并且FullCalendar将不会显示该时间。这个问题在这个答案中有很深的介绍

还有一点要注意:您使用的是FullCalendar v1.5.4,它确实很旧,我建议您升级。如果要升级,请记住,FullCalendar现在依靠

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

设置开始时间以完整日历显示

来自分类Dev

如何自定义线图的 24 小时开始时间和结束时间?(例如,从 7:30 开始)

来自分类Dev

如何比较我选择的日历结束时间是否早于 12 小时日历时间的所选日历开始时间?

来自分类Dev

如果开始日期与结束日期相同,则为完整日历

来自分类Dev

在mysql中的开始时间和结束时间之间获取30分钟的间隔数据

来自分类Dev

将开始时间设为静态1小时

来自分类Dev

从一个小时开始,如何在30分钟内运行10次cronjob?

来自分类Dev

如果开始时间在22:00到24:00之间,则在月模式下的2天中显示完整日历4.0事件

来自分类Dev

如何更改relatime访问时间的更新间隔(从24小时开始)?

来自分类Dev

如何更改relatime访问时间的更新间隔(从24小时开始)?

来自分类Dev

Javascript日期减去30分钟/完整日历调整大小错误

来自分类Dev

从最近4小时开始,每15分钟间隔获取一次所有时间

来自分类Dev

从数据库中获取事件详细信息(标题,开始和结束)以获取完整日历

来自分类Dev

我已将 Grub 超时设置为 4 秒。但有时,grub 会在 30 秒后开始启动。为什么?怎么了?

来自分类Dev

如何使此计时器变为仅在提交表单后开始,然后执行php代码1st。然后禁用提交按钮,等待30,然后重新启用?

来自分类Dev

如何将int转换为时间(例如,将“ 1930”转换为“ 19:30”),并以小时和分钟(HH:MM)为单位获取开始时间和结束时间之间的差?

来自分类Dev

从顶部开始以30px滚动div

来自分类Dev

允许将完整日历事件的大小调整到特定的时间间隔

来自分类Dev

PHP Event预订:30分钟内获取时间为1小时

来自分类Dev

完整日历不会显示时间标签

来自分类Dev

使用熊猫来计算从开始时间到不规则时间间隔的一小时内发生的用户订单

来自分类Dev

完整的Google日历活动的开始/结束格式

来自分类Dev

如何增加5小时30分钟的时间?

来自分类Dev

我必须验证时间为 1 小时。开始和结束时间不得超过 1 小时

来自分类Dev

完整日历-MinMax Time + SlotDuration不显示小时列

来自分类Dev

如何在完整日历中隐藏小时线

来自分类Dev

安排作业在每小时开始时开始

来自分类Dev

FullCalendar日历开始日期

来自分类Dev

从Firefox 30开始无法动态更改PageMod ContentScriptOptions

Related 相关文章

  1. 1

    设置开始时间以完整日历显示

  2. 2

    如何自定义线图的 24 小时开始时间和结束时间?(例如,从 7:30 开始)

  3. 3

    如何比较我选择的日历结束时间是否早于 12 小时日历时间的所选日历开始时间?

  4. 4

    如果开始日期与结束日期相同,则为完整日历

  5. 5

    在mysql中的开始时间和结束时间之间获取30分钟的间隔数据

  6. 6

    将开始时间设为静态1小时

  7. 7

    从一个小时开始,如何在30分钟内运行10次cronjob?

  8. 8

    如果开始时间在22:00到24:00之间,则在月模式下的2天中显示完整日历4.0事件

  9. 9

    如何更改relatime访问时间的更新间隔(从24小时开始)?

  10. 10

    如何更改relatime访问时间的更新间隔(从24小时开始)?

  11. 11

    Javascript日期减去30分钟/完整日历调整大小错误

  12. 12

    从最近4小时开始,每15分钟间隔获取一次所有时间

  13. 13

    从数据库中获取事件详细信息(标题,开始和结束)以获取完整日历

  14. 14

    我已将 Grub 超时设置为 4 秒。但有时,grub 会在 30 秒后开始启动。为什么?怎么了?

  15. 15

    如何使此计时器变为仅在提交表单后开始,然后执行php代码1st。然后禁用提交按钮,等待30,然后重新启用?

  16. 16

    如何将int转换为时间(例如,将“ 1930”转换为“ 19:30”),并以小时和分钟(HH:MM)为单位获取开始时间和结束时间之间的差?

  17. 17

    从顶部开始以30px滚动div

  18. 18

    允许将完整日历事件的大小调整到特定的时间间隔

  19. 19

    PHP Event预订:30分钟内获取时间为1小时

  20. 20

    完整日历不会显示时间标签

  21. 21

    使用熊猫来计算从开始时间到不规则时间间隔的一小时内发生的用户订单

  22. 22

    完整的Google日历活动的开始/结束格式

  23. 23

    如何增加5小时30分钟的时间?

  24. 24

    我必须验证时间为 1 小时。开始和结束时间不得超过 1 小时

  25. 25

    完整日历-MinMax Time + SlotDuration不显示小时列

  26. 26

    如何在完整日历中隐藏小时线

  27. 27

    安排作业在每小时开始时开始

  28. 28

    FullCalendar日历开始日期

  29. 29

    从Firefox 30开始无法动态更改PageMod ContentScriptOptions

热门标签

归档