jquery - How to select multiple date ranges from Fullcalendar? -

i trying make calendar feature in user can block off multiple date ranges selecting start , end dates. thinking of using fullcalendar not sure how proceed this.

i did see examples of how block dates being selected adding check on dayclick these not deal date ranges. appreciate help, not looking entire source suggestions on how go this.

this multi-part problem. here's basic idea.

• allow user make click+drag selection selectable: true
• in select callback, add background event addeventsource.
• when adding event, give custom property: block: true.
• use custom function selectoverlap returns false if event.block.

something jsfiddle.

selectable: true, select: function (start, end, jsevent, view) {     $("#calendar").fullcalendar('addeventsource', [{         start: start,         end: end,         rendering: 'background',         block: true,     }, ]);     $("#calendar").fullcalendar("unselect"); }, selectoverlap: function(event) {     return ! event.block; } 

background events optional, desired (visually).

if dragging , dropping created events desired, can use selectoverlap function in eventoverlap well.