FullCalendar - agendaWeekビューでdayヘッダーをクリックしてDateを取得する

Question

agendaWeekビューでdayヘッダーセルをクリックしたときに選択された日付を特定したいと思います。これらのヘッダーセルにクリックハンドラーを追加できますが、ヘッダーをクリックするとdayClickイベントが発生しないため、fullcalendarから日付を取得する方法がわかりません。これらのセルのクラスはfc-sun、fc-monなどです。

Answer 1

誰もまだ私がやったことはありません。アジェンダviewObjectには、現在の週の開始日と終了日が表示されます。表示された週のすべての日付を含む配列を作成しました。その後、JQueryを使用してすべてのヘッダーセルを選択し、各タグに日付属性を追加しました。また、各thタグにclickイベントを追加し、ヘッダーをクリックしたときに日付属性を取得しました。新しい週ごとにこのプロセスを実行する必要があります。

Answer 2

この回避方法を試してみてください。 これは、agendaWeekからagendaDayへのナビゲーションを日ヘッダーをクリックすることで簡単に行うことができます。これは、fullcalendar initの後にzumaMaker（）を呼び出すだけです。

function zumaMaker() { 

var arrayUIDays = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun']; 
for (var m = 0; m < arrayUIDays.length; m++) { 
    var dim = ".fc-day-header.fc-widget-header.fc-" + arrayUIDays[m]; 
    var dok = $(dim).html(); 
    $(dim).attr("onclick", "zumaMethod('" + dok + "','" + dim + "');"); 
    $(dim).css("cursor", "pointer"); 
    } 
} 

function zumaMethod(doma, diver) { 

    var date = doma.split(" ")[1].split("/"); 
    var day = date[0]; 
    var month = date[1]; 
    var year = date[2]; 
    var off_date = year + "-" + month + "-" + day + "T" + "00:00:00"; 

    $("#pl_tbl").fullCalendar('changeView', 'agendaDay'); 
    $("#pl_tbl").fullCalendar('gotoDate', off_date); 
    $(diver).css("cursor", "pointer"); 
    $(diver).attr("onclick", "zumaMethodRevert();"); 
} 

function zumaMethodRevert() { 
    $("#pl_tbl").fullCalendar('changeView', 'agendaWeek'); 
    zumaMaker(); 
} 

また、このcssを追加すると、ホバーの日ヘッダーをカスタマイズできます。

.fc-day-header:hover { 
    background-color: orange; 
} 
.fc-day-header { 
    background-color: white; 
}