ユーザー設定に基づいてFullCalendarのデフォルトビューを設定する

Question

カレンダーにボタンを追加して、デフォルトのビューを現在のビューに設定することができます。私は既定のビュー（たとえばdefaultView: basicWeek）を設定することができますが、カレンダーを閉じて再度開くと、リセットされます。次にカレンダーの現在のビューを取得して、次にアプリケーションを開くためにアプリケーション変数に保存する方法はありますか？

Answer 1

この例は100％で動作する場合もありません（ウェブサーバーではテストできず、スニペットでドキュメントがサンドボックス化されているため動作しません）。

エラーがある場合は教えてください。

$(function() { 
 
    var view = localStorage.getItem('calendarView') || 'month'; 
 
    view = (view != undefined) ? view : 'basicWeek'; 
 
    $('#calendar').fullCalendar({ 
 
    'viewRender': function(view) { 
 
     localStorage.setItem('calendarView', view.type); 
 

 
    }, 
 
    'defaultView': view 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.15.1/moment.min.js"></script> 
 

 

 
<link href="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.css" rel="stylesheet" /> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.0.1/fullcalendar.min.js"></script> 
 
<div id="calendar"> 
 
</div>

Answer 2

ユーザーがローカルストレージにデフォルトとして設定しているとの見方を保存したいと思います。その後

viewNameは、デフォルトのビュー（例えば「basicWeek」）の文字列名です

localStorage.setItem("fc-custom-default", viewName); 

、中：あなたが行を追加し、デフォルトのビューを変更するために使用するのと同じ機能で

customButtons:の場合、デフォルトのビューボタンのclick関数コールバックを定義するときは、キーがストレージに存在するかどうかを確認し、存在する場合は、その値をclickで呼び出される 'changeView'関数のviewNameとして使用します。それ以外の場合は、標準のデフォルトを使用してください。これは以下のようになります。

$("#calendar") 
    .fullCalendar({ 
     customButtons: { 
      defaultButton:{ 
       label: "Default View", 
       click: function(){ 
         var viewName = "month" //this is the default if nothing has been set 
         if(localStorage.getItem("fc-custom-default") !== null)) 
         { 
          viewName = localStorage("fc-custom-default"); 
         } 
         $("#calendar").fullCalendar('changeView', viewName); 
        } 
       }, 

あなたはすべてのクリックでストレージから値を取得するための関数を呼び出していませんので、あなたはまた、クリック機能の変数外に現在のデフォルト値を格納することができます。

Answer 3

私はviewRenderを使用する最良の方法を見つけました。カレンダービューが変更されるたびに呼び出されます。ここに私がしたことがあります：

$('#calendar').fullCalendar({ 
    header: { 
     left: 'prev,next today', 
     center: 'title', 
     right: 'month,agendaWeek,agendaDay,listWeek' 
    }, 
    viewRender: function(view) { 
     localStorage.setItem('Default_FullCalendar_View', view.name); 
    }, 

    eventClick: function(calEvent, jsEvent, view) { 
     if(calEvent.event_type == "Task"){ 
      LightviewOpen("/portal/Task.asp", "Update", "Task_ID", calEvent.id, "Update", 1200, 700); 
     } else { 
      window.open("LeadSystem/Lead.asp?New_Window=True&Open_Lead_ID=" + calEvent.id); 
     } 
    }, 
    defaultView:localStorage.getItem("AI_Default_FullCalendar_View"), 
    eventLimit: true, // allow "more" link when too many events 
    navLinks: true, 
    height: (window.innerHeight - $("footer").height() - $("#calendar").position().top)*.8, 
    windowResize: function(view) {$('#calendar').height((window.innerHeight - $("footer").height()-$("#calendar").position().top)*.9);}, 
    eventSources:[ 
     { 
      url: 'ajax.asp?serverside=PopulateCalendar&GetDownline=true', 
      type: 'Post' 
     } 
    ] 

})