Zeitzone funktioniert nicht richtig für FullCalendar

Question

immer noch herum mit FullCalendar. Ich versuche herauszufinden, warum, wenn das dayClick-Ereignis abgefeuert wird, der dateTime-Parameter selbst immer noch in GMT ist, wenn ich versucht habe, ihn auf local und UTC zu setzen. Es ist im Wesentlichen ein ganzer Tag zurück. Ich werde am 19. März klicken und dateTime wird am 18. März sein.

Hier ist mein Kalender config und meine dayClick Ereignisse:

 vm.uiConfig = { 
     calendar: { 
      height: 350, 

      editable: false, 
      draggable: false, 
      selectable: true, 
      selectHelper: true, 
      unselectAuto: false, 
      disableResizing: false, 
      droppable: false, 
      handleWindowResize: true, 
      timezone: "local", 
      ignoreTimezone: false, 
      header: { 
       left: "title", 
       center: "", 
       right: "today prev,next" 
      }, 

      dayClick: vm.dayClick 
     } 
    }; 

    vm.dayClick = function(dateTime, jsEvent, view) 
    { 
     // change the day's background color just for fun 
     if (vm.previousCell) 
      vm.previousCell.css("background-color", vm.previousCellCSS); 

     vm.previousCell = $(this); 
     vm.previousCellCSS = vm.previousCell.css("background-color"); 
     vm.previousCell.css("background-color", "lightgrey"); 

     vm.selectedDate = { 
      date: new Date(dateTime) 
     }; 
    }; 

Ich habe versucht, die "Zeitzone", "utc" und die "ignoreTimezone" Eigenschaften sowie Anpassung, no go. Ich habe gesehen, dass einige Leute sagen, dass es ein Problem mit meiner OS-Uhr ist, da dort die Zeit herkommt, aber ich glaube nicht, dass das der Fall ist. Irgendwelche Ideen? Ich habe meinen Höhepunkt erreicht und habe kein Glück gehabt. Danke im Voraus!

Answer 1

Ich hatte das gleiche Problem mit FullCalendar V2.3.1, JQuery V1.11.2, Moment V2.10.2 und Moment-Timezone V0.3.1 mit einer MySQL-Datenbank.

Das Problem war der Datentyp des Start- und Enddatums des Ereignisses. Ich hatte sie als dateTime gespeichert. Als ich sie als timeStamps gespeichert habe, hat es angefangen zu arbeiten. Nachfolgend finden Sie einen Auszug der wichtigen Elemente meines Codes. Hoffe das hilft dir.

$('#calendar').fullCalendar({ 
     events: function(start, end, timezone, callback) { 
      $.ajax({ 
       url: '/s/calendar_eventdata.php', 
       method: 'POST', 
       dataType: 'json', 
       data: 'uid=' + uidArray + '&start=' + start + '&end=' + end, 
       success: function(userData) { 
        var user_count = userData.length; 
        var eventData = []; 
        // Assemble the event objects 
        for (var i = 0; i < user_count; i++) 
        { 
         var uid = userData[i].uid; 
         var source = '/s/calendar_eventdata.php?e=' + userData[i].uid; 

         // Determine if the event is all day 
         var all_day = false; 
         if(userData[i].allDay === 1) 
         { 
          all_day = true; 
         } 

         // Add each source to a JSON feed object 
         eventData.push({ 
          source: source, 
          id: userData[i].eid, 
          eid: userData[i].eid, 
          p_eid: userData[i].p_eid, 
          uid: userData[i].uid, 
          p_uid: userData[i].p_uid, 
          etid: userData[i].etid, 
          typeIcon: userData[i].icon, 
          title: userData[i].title, 
          location: userData[i].location, 
          description: userData[i].description, 
          allDay: all_day, 
          start: moment.tz(userData[i].start_date, userData[i].saveTimezone).tz(deviceTimeZone), 
          end: moment.tz(userData[i].end_date, userData[i].saveTimezone).tz(deviceTimeZone), 
          saveTimezone: userData[i].saveTimezone, 
          duration: userData[i].duration, // todo: display as days, minutes, hours instead of only minutes 
          pharmaPropName: userData[i].pharmaPropName, 
          pharmaForm: userData[i].pharmaForm, 
          pharmaQuantity: userData[i].pharmaQuantity, 
          pharmaNotes: userData[i].pharmaNotes, 
          pharmaEntry: userData[i].pharmaEntry, 
          editable: true, 
          durationEditable: true, 
          backgroundColor: userData[i].cal_color, 
          borderColor: '#ffffff', 
          textColor: userData[i].txt_color 
          //error: function() { alert('There was an error loading calendar data.');} 
         }); 
        } 
        callback(eventData); 
       } 
      }); 
     }, 
     editable: true, 
     draggable: true, 
     resizeable: true, 
     theme: false, 
     selectable: true, 
     selectHelper: true, 
     unselectAuto: true, 
     eventStartEditable: true, 
     eventDurationEditable: true, 
     eventLimit: true, 
     defaultView: 'agendaWeek', 
     allDayDefault: false, 
     slotMinutes: 15, 
     snapMinutes: 15, 
     defaultEventMinutes: 30, 
     firstHour: 8, 
     timezone: deviceTimeZone, 
     year: moment.tz(deviceTimeZone).format("YYYY"), 
     month: moment.tz(deviceTimeZone).format("M"), 
     date: moment.tz(deviceTimeZone).format("DD"), 
     header: { 
      left: 'prev,next today', 
      center: 'title', 
      right: 'month,agendaWeek,agendaDay' 
     }, 
     buttonText: { 
      month: 'Month', 
      agendaWeek: 'Week', 
      agendaDay: 'Day' 
     });