如何在议程日视图中正确呈现完整日历

Posted

技术标签:

【中文标题】如何在议程日视图中正确呈现完整日历【英文标题】:How to render properly a Full calendar in agendaDay view 【发布时间】:2018-09-21 22:03:58 【问题描述】:

如何正确呈现议程日视图的完整日历。它没有呈现议程日视图。

只有在点击“下一个”、“上一个”或“今天”按钮时才会呈现。我想使用agendaDay 显示今天的议程。

在给定的 javascript 下,有什么方法可以将今天作为默认渲染?

请提出建议。

var Calendar = function () 
  var a = function () 
    var a = $("#event-management");

    $("#event-categories div.event-category").each(function () 
      var a = 
        title: $.trim($(this).text())
      ;
      $(this).data("eventObject", a), $(this).draggable(
        zIndex: 999,
        revert: !0,
        revertDuration: 50
      )
    );
    var b = new Date,
      c = b.getDate(),
      d = b.getMonth(),
      e = b.getFullYear(),
      f = "",
      g = $("#calendar").fullCalendar(

        themeButtonIcons: 
          prev: '<i class="fa fa-angle-left"></i>',
          next: '<i class="fa fa-angle-right"></i>'
        ,
        defaultView: 'agendaDay',
        header: 
          //left: "prev,next today",
          left: "prev,next today",
          right: "title",
          // right: "agendaDay,agendaWeek,month"
        ,

        editable: true,
        droppable: true,
        drop: function (a, b) 
          var c = $(this).data("eventObject"),
            d = $(this).attr("data-class"),
            e = $.extend(, c);
          e.start = a, e.allDay = b, d && (e.className = [d]), $("#calendar").fullCalendar("renderEvent", e, !0), $("#drop-remove").is(":checked") && $(this).remove()
        ,



        select: function (b, c, d) 
          a.modal(
            backdrop: "static"
          ), f = $("<form></form>"), f.append("<div class='row'></div>"), f.find(".row").append("<div class='col-md-6'><div class='form-group'><label class='control-label'>Schedule an activity</label><input class='form-control' placeholder='Activity Name' type=text name='title'/></div></div>").append("<div class='col-md-6'><div class='form-group'><label class='control-label'>Category</label><select class='form-control' name='category'></select></div></div>").find("select[name='category']").append("<option value='label-default'>Work</option>").append("<option value='label-green'>Home</option>").append("<option value='label-purple'>Holidays</option>").append("<option value='label-orange'>Party</option>").append("<option value='label-yellow'>Birthday</option>").append("<option value='label-teal'>Generic</option>").append("<option value='label-beige'>To Do</option>"), a.find(".remove-event").hide().end().find(".save-event").show().end().find(".modal-body").empty().prepend(f).end().find(".save-event").unbind("click").click(function () 
            f.submit()
          ), a.find("form").on("submit", function () 
            return title = f.find("input[name='title']").val(), $categoryClass = f.find("select[name='category'] option:checked").val(), null !== title && g.fullCalendar("renderEvent", 
              title: title,
              start: b,
              end: c,
              allDay: d,
              className: $categoryClass
            , !0), a.modal("hide"), !1
          ), g.fullCalendar("unselect")
        ,
        eventClick: function (b, c, d) 
          var e = $("<form></form>");
          e.append("<label>Change event name</label>"), e.append("<div class='input-group'><input class='form-control' type=text value='" + b.title + "' /><span class='input-group-btn'><button type='submit' class='btn btn-success'><i class='fa fa-check'></i> Save</button></span></div>"), a.modal(
            backdrop: "static"
          ), a.find(".remove-event").show().end().find(".save-event").hide().end().find(".modal-body").empty().prepend(e).end().find(".remove-event").unbind("click").click(function () 
            g.fullCalendar("removeEvents", function (a) 
              return a._id == b._id
            ), a.modal("hide")
          ), a.find("form").on("submit", function () 
            return b.title = e.find("input[type=text]").val(), g.fullCalendar("updateEvent", b), a.modal("hide"), !1
          )
        
      )
  ;
  return 
    init: function () 
      a()

    
  
();

【问题讨论】:

【参考方案1】:

如果我理解正确,您想将今天的日期设为默认日期。

您可以在日历脚本中尝试此操作。

defaultDate = new Date();

这是您可以阅读的链接。 https://fullcalendar.io/docs/defaultDate

【讨论】:

$('#calendar').fullCalendar( defaultDate: new Date() )

以上是关于如何在议程日视图中正确呈现完整日历的主要内容,如果未能解决你的问题,请参考以下文章

带有谷歌日历的完整日历

如何在完整日历 Jquery 的周视图和日视图中隐藏开始时间(.fc-time)?

如何在从父视图过滤时重新渲染完整日历

JQuery完整日历,如何更改视图

完整日历议程查看不显示周日活动

jQuery FullCalendar:在议程视图中禁用滚动?