Question

这就是事情，

我正在为我的网站中的用户制作日历视图，在那里我可以显示他们的月度会议和那些分类信息。我使用的是fullcalendar。只启用了月视图。还有下一个和上一个箭头按钮。

这就是我尝试做的事情。当用户点击其中一个箭头按钮时，我将获取所选月份的月份和年份信息，并使用ajax调用将其传递给后端服务以获取他/她的会议并将其显示在该日历上。 / p>

但是，我无法获得月份和年份信息。我尝试了两种方法来实现这一目标。

方法1

尝试在viewrender

上获取它

viewRender: function(event, view, element) {
  console.log(view.start, view.end, view.intervalStart, view.intervalEnd);
  console.log($('#calendar').fullCalendar('getDate'));
  var date = new Date();
  var m = date.getMonth();
  var y = date.getFullYear();
  console.log(m + y);
}

方法1没有结果。

方法2 ：我能够获得箭头按钮的点击事件，但我得到的年份和月份分别是2016和11。< / p>

  $('.fc-button-prev span').click(function() {
    var date = new Date();
    var m = date.getMonth();
    var y = date.getFullYear();
    console.log(m);
  });

  $('.fc-button-next span').click(function() {
    var date = new Date();
    var m = date.getMonth();
    var y = date.getFullYear();
    console.log(y);
  });

我在我的小提琴中评论了方法2。

这是我的FIDDLE。

如果你想看代码。

$(document).ready(function() {
  var date = new Date();
  var d = date.getDate();
  var m = date.getMonth();
  var y = date.getFullYear();

  var calendar = $('#calendar').fullCalendar({
    defaultView: 'month',
    header: {
      left: 'prev,next',
      center: 'title',
      right: 'month'
    },
    eventRender: function(event, element, view) {
      var nextEventLeft = element.offset().left + element.width() + 5;
      element.parent().children().eq(element.index() + 1).css('left', nextEventLeft);
    },

    viewRender: function(event, view, element) {
      console.log(view.start, view.end, view.intervalStart, view.intervalEnd);
      console.log($('#calendar').fullCalendar('getDate'));
      var date = new Date();
      var m = date.getMonth();
      var y = date.getFullYear();
      console.log(m + y);
    },

    selectable: true,
    selectHelper: true,

    year: y,
    month: m,
    date: d,

    slotMinutes: 15,
    editable: true,

    events: [{
      title: 'Sales Meeting',
      start: new Date(y, m, d, 10, 30),
      end: new Date(y, m, d, 11, 30),
      allDay: false,
      className: 'fc-event-width-overirde'
    }, {
      title: 'Marketing Meeting',
      start: new Date(y, m, d, 10, 30),
      end: new Date(y, m, d, 11, 30),
      allDay: false,
      className: 'fc-event-width-overirde'
    }, {
      title: 'Production Meeting',
      start: new Date(y, m, d, 10, 30),
      end: new Date(y, m, d, 11, 30),
      allDay: false,
      className: 'fc-event-width-overirde'
    }]

  });
  /*
  $('.fc-button-prev span').click(function() {
    var date = new Date();
    var m = date.getMonth();
    var y = date.getFullYear();
    console.log(m);
  });

  $('.fc-button-next span').click(function() {
    var date = new Date();
    var m = date.getMonth();
    var y = date.getFullYear();
    console.log(y);
  });
  */

});

Answer 1

这是相同要求的工作代码。隐式地以UNIX系统格式显示日历的完整日历传递开始日期和结束日期。

$('#calendar').fullCalendar({
		header: {
			left: 'prev,next',
			center: 'title',
			right: ''
		},
		editable: true,
		   eventSources: [{
			   url: ' your url.. ',
	            type: 'POST',
	            data: {
	            		dataType: 'json',
		    			pagination : true,
		    			viewType : 'calendar',
						..... your params goes here ,
	            },
	            error: function() {
	                alert('there was an error while fetching events!');
	            }
		   }]
		,
		eventClick: function(calEvent, jsEvent, view) 
		{
			
			
		var clickdDate =$.fullCalendar.formatDate(calEvent.start, "dd MMM yyyy");
		
			// do something with clickdDate in calendar if want
	      	
	    }
	});

Answer 2

您将获得完整的日期，以便您可以修改它以获取年份和月份

var moment = $('#calendar').fullCalendar('getDate').format().split('-');

时刻[0] - ＆gt;一年时刻[1] - ＆gt;日期

fullcalendar-无法获取所选月份的月份和年份

2 个答案: