2016-08-31 2 views
2

Ich möchte meine Ereignisse wiederholen jeden Tag, jeden Monat und jede Woche. Nach der Vollkalenderdokumentation können Ereignisse beim Rendern von Ereignissen mit dow-Parametern wöchentlich wiederholt werden. Also habe ich das auch so verwendet, um es täglich mit folgendem Code zu wiederholen.Wiederholen Sie Vollkalender-Ereignisse täglich, monatlich und jährlich

[[id:7718, type:null, 
resourceIds:[13], 
title:Kas, 
start:2016-08-10T07:00:00.000+05:45, 
end:2016-08-10T22:00:00.000+05:45, 
allDay:false, 
note:dsadsa, 
member:, 
dow:[0,1,2,3,4,5,6], 
ranges:[[start:2016-08-10T07:00:00.000+05:45, end:2021-08-10T07:00:00.000+05:45]], 
]] 

Gibt es eine Möglichkeit, sie jeden Monat und jedes Jahr wiederholen zu lassen? Jede Hilfe wäre willkommen.

Antwort

0

Nun ... leider müssen Sie das viewRender-Ereignis verwenden und dem Datum das aktuelle Jahr zuweisen. Diese ist eine Funktionalität, die für eine lange Zeit gewartet wurde; '- ( Wenn Sie Entdeckung eine andere Art und Weise, bitte, sag mir Gleiche in diese andere Frage: link

1

Ich lasse das hier für neue Leute!. , in dieser Frage interessiert) Ein kleiner Trick für das Hinzufügen von wiederkehrenden Ereignissen ohne doppelte Datensätze in db.

‚Birthday Party‘ ist eine jährliche Veranstaltung, ‚Meeting‘ ist monatliche Veranstaltung, ‚wiederholendes Ereignis‘ ist benutzerdefiniertes Ereignis, zweimal wiederholen, ‚Klicken für Google‘ ist ein Ereignis, jeden Montag und Freitag zu wiederholen

var defaultEvents = [ 
 
    { 
 
    // Just an event 
 
    title: 'Long Event', 
 
    start: '2017-02-07', 
 
    end: '2017-02-10', 
 
    className: 'scheduler_basic_event' 
 
    }, 
 
    { 
 
    // Custom repeating event 
 
    id: 999, 
 
    title: 'Repeating Event', 
 
    start: '2017-02-09T16:00:00', 
 
    className: 'scheduler_basic_event' 
 
    }, 
 
    { 
 
    // Custom repeating event 
 
    id: 999, 
 
    title: 'Repeating Event', 
 
    start: '2017-02-16T16:00:00', 
 
    className: 'scheduler_basic_event' 
 
    }, 
 
    { 
 
    // Just an event 
 
    title: 'Lunch', 
 
    start: '2017-02-12T12:00:00', 
 
    className: 'scheduler_basic_event', 
 
    }, 
 
    { 
 
    // Just an event 
 
    title: 'Happy Hour', 
 
    start: '2017-02-12T17:30:00', 
 
    className: 'scheduler_basic_event' 
 
    }, 
 
    { 
 
    // Monthly event 
 
    id: 111, 
 
    title: 'Meeting', 
 
    start: '2000-01-01T00:00:00', 
 
    className: 'scheduler_basic_event', 
 
    repeat: 1 
 
    }, 
 
    { 
 
    // Annual avent 
 
    id: 222, 
 
    title: 'Birthday Party', 
 
    start: '2017-02-04T07:00:00', 
 
    description: 'This is a cool event', 
 
    className: 'scheduler_basic_event', 
 
    repeat: 2 
 
    }, 
 
    { 
 
    // Weekday event 
 
    title: 'Click for Google', 
 
    url: 'http://google.com/', 
 
    start: '2017-02-28', 
 
    className: 'scheduler_basic_event', 
 
    dow: [1,5] 
 
    } 
 
]; 
 

 
// Any value represanting monthly repeat flag 
 
var REPEAT_MONTHLY = 1; 
 
// Any value represanting yearly repeat flag 
 
var REPEAT_YEARLY = 2; 
 
    
 
$('#calendar').fullCalendar({ 
 
    header: { 
 
\t \t left: 'prev,next today', 
 
\t \t center: 'title', 
 
\t \t right: 'month,agendaWeek,agendaDay' 
 
\t }, 
 
    editable: true, 
 
    defaultDate: '2017-02-16', 
 
\t eventSources: [defaultEvents], 
 
    dayRender: function(date, cell) { 
 
    // Get all events 
 
    var events = $('#calendar').fullCalendar('clientEvents').length ? $('#calendar').fullCalendar('clientEvents') : defaultEvents; 
 
\t \t // Start of a day timestamp 
 
    var dateTimestamp = date.hour(0).minutes(0); 
 
    var recurringEvents = new Array(); 
 
    
 
\t \t // find all events with monthly repeating flag, having id, repeating at that day few months ago 
 
    var monthlyEvents = events.filter(function (event) { 
 
     return event.repeat === REPEAT_MONTHLY && 
 
     event.id && 
 
     moment(event.start).hour(0).minutes(0).diff(dateTimestamp, 'months', true) % 1 == 0 
 
    }); 
 
    
 
    // find all events with monthly repeating flag, having id, repeating at that day few years ago 
 
    var yearlyEvents = events.filter(function (event) { 
 
     return event.repeat === REPEAT_YEARLY && 
 
     event.id && 
 
     moment(event.start).hour(0).minutes(0).diff(dateTimestamp, 'years', true) % 1 == 0 
 
    }); 
 

 
    recurringEvents = monthlyEvents.concat(yearlyEvents); 
 

 
    $.each(recurringEvents, function(key, event) { 
 
     var timeStart = moment(event.start); 
 

 
     // Refething event fields for event rendering 
 
     var eventData = { 
 
     id: event.id, 
 
     allDay: event.allDay, 
 
     title: event.title, 
 
     description: event.description, 
 
     start: date.hour(timeStart.hour()).minutes(timeStart.minutes()).format("YYYY-MM-DD"), 
 
     end: event.end ? event.end.format("YYYY-MM-DD") : "", 
 
     url: event.url, 
 
     className: 'scheduler_basic_event', 
 
     repeat: event.repeat 
 
     }; 
 
\t \t \t 
 
     // Removing events to avoid duplication 
 
     $('#calendar').fullCalendar('removeEvents', function (event) { 
 
      return eventData.id === event.id && 
 
      moment(event.start).isSame(date, 'day');  
 
     }); 
 
     // Render event 
 
     $('#calendar').fullCalendar('renderEvent', eventData, true); 
 

 
    }); 
 

 
    } 
 
});
#calendar { 
 
\t width: 100%; 
 
\t margin: 0 auto; 
 
}
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.css" /> 
 
</head> 
 
<body> 
 
<script src="https://cdn.jsdelivr.net/momentjs/2.14.1/moment-with-locales.min.js"></script> 
 

 
<script src="https://code.jquery.com/jquery-2.1.4.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/fullcalendar/3.1.0/fullcalendar.js"></script> 
 

 
    <div id='calendar'></div> 
 
</body> 
 
</html>

Verwandte Themen