FullCalendar v3.3.1 기준으로 작성됨.
다른 옵션 같은건 많이 있지만, FullCalendar 에서 이번달 또는 다음달을 이용해서 월을 변경 했을때
ajax를 이용해서 해당 월의 데이터를 가져오는 내용은 잘 안보여서 적어본다.
$('#calendar').fullCalendar({
contentHeight:420,
height: 400,
locale: "ko",
header : {
left : 'prev, today',
center : 'title',
//right : 'month,agendaWeek,agendaDay'
right : 'next'
},
editable : true,
buttonIcons: true, // show the prev/next text
weekNumbers: false,
navLinks: false, // can click day/week names to navigate views
editable: false,
eventLimit: false, // allow "more" link when too many events
eventOrder: "-title",
events: function(start, end, timezone, callback) {
//--start, end 는 ui상에 보이는 시작일과 마지막일이다.
//-- ui상에 사작일은 현재월의 1일이 아니라 전달의 날짜가 올수도 있다.
//-- 마찬가지로 end일은 현재월의 마지막일이 아니라 다음달의 날짜가 올수도 있다.
//-- 달력에서 월을 변경하게 되면 변경된 월의 현재 날짜가 오거나
//-- 변경된 월의 1일이 온다.
var cDate = $('#calendar').fullCalendar('getDate');
var date = new Date(cDate).format("yyyyMM");
$.ajax({
url: "./getMonthSchedule.do",
beforeSend : function(xmlHttpRequest){
xmlHttpRequest.setRequestHeader("AjaxCall", "true"); // ajax 호출을 header에 기록
},
dataType: 'json',
type : "post",
data: {
date:date
},
success: function (result) {
//var events = data.jsonTxt;
callback(result.schedule);
},
error:function(xhr, textStatus, error){
if(xhr.status=="500"){
location.href = "../login/login.do";
}
}
});
},
dayClick: function(date, jsEvent, view) {
alert('Clicked on: ' + date.format());
}
});
사용하고 있는 FullCalendar 초기화 소스임...
stackoverflow에는 event:function에 파라미터가 function(start, end, timezone, callback) 3개뿐이 없더라...ㅡㅡ;;
ajax에서 데이터를 불러와서 callback을 호출을 해도 javascript에서 에러만 나길래...열심히 구글링을 해보니
timezone이 추가된 내용이 있어서 해봤더니...좔~ 된다.ㅎㅎ
위 소스에서 요점은
var cDate = $('#calendar').fullCalendar('getDate');
이부분이다. $('#calendar').fullCalendar('getDate'); 를 하게 되면 이전달, 다음달 버튼을 통해 월을 변경했을때, 현재월이면 현재월일 이오고,
그렇지 않을경우 즉 현재월이 아닌 경우는 해당월의 1일이 온다.