jQuery FullCalendar.js: disable prev/next button for past/future dates

fullCalendarDisablePrevNext.js

$('#calendar').fullCalendar({
 	viewRender: function(currentView){
		var minDate = moment(),
		maxDate = moment().add(2,'weeks');
		// Past
		if (minDate >= currentView.start && minDate <= currentView.end) {
			$(".fc-prev-button").prop('disabled', true); 
			$(".fc-prev-button").addClass('fc-state-disabled'); 
		}
		else {
			$(".fc-prev-button").removeClass('fc-state-disabled'); 
			$(".fc-prev-button").prop('disabled', false); 
		}
		// Future
		if (maxDate >= currentView.start && maxDate <= currentView.end) {
			$(".fc-next-button").prop('disabled', true); 
			$(".fc-next-button").addClass('fc-state-disabled'); 
		} else {
			$(".fc-next-button").removeClass('fc-state-disabled'); 
			$(".fc-next-button").prop('disabled', false); 
		}
	}
});

Thank you all! This is so helpful. Deeply grateful.

For anyone using the Event Organiser plugin for WordPress, you can register the same script again with a 0 priority on it to replace the plugin version of fullcalendar.min.js with your own. Here's an image of some php to do so, modify for your paths and your situation.

Create a copy of the fullcalendar.js (not the min version) and add the code in Plaristote's example, but not the function part. See the following screen shot on where to add it. Clear your browser cache, test it, use dev tools to do your own trouble shooting. Then you will save that file, make a copy, pack it with a .min or .packed (whatever) and then be sure it's name and path match the php code. Then pack it and adjust the paths and such in the php. For those who are not so hot with code, it might be worth hiring a dev to do this.

ASSETS_URL is a constant that is defined in the functions.php file.
Assumes a child theme.

define( 'CHILD_URL' , get_stylesheet_directory_uri() );
define( 'ASSETS_URL' , CHILD_URL . '/assets/'  );

CHILD_URL is part of Genesis, so don't re add.

Do not go by line numbers. Look and see that in the conditional CurrentView is where you would add the limit to the prev and next button functions.

	/*
	 * Limit Past and Future Navigation
	 * Thread: https://gist.github.com/juanbrujo/c4a0a8d36fc64860f487
	 * Code author: https://gist.github.com/juanbrujo/c4a0a8d36fc64860f487#gistcomment-2168668
	 * Ref: var minDate = moment(); // now
	*/
	var minDate      = moment('2017-12-01'), // nothing past december 17
        maxDate      = moment().add( 1, 'years'),
        parentCont   = currentView.el.parent().prev(),
        cantGoBefore = currentView.start <= minDate,
        cantGoAfter  = currentView.end >= maxDate;

		$( '.fc-prev-button', parentCont ).prop( 'disabled', cantGoBefore );
		$( '.fc-prev-button', parentCont ).toggleClass( 'fc-state-disabled', cantGoBefore );
		$( '.fc-next-button', parentCont ).prop( 'disabled', cantGoAfter );
		$( '.fc-next-button', parentCont ).toggleClass( 'fc-state-disabled', cantGoAfter );
		
		//end limit past and future nav

Nice Job.....
any one is there who let me know how to disable future dates

how can i disable previous button that user not to enter past date?
i'd used this condition,but its not working
if($("#startdatepicker1").datepicker("getDate").getDate() < today)

Thank you, I was in great need of this solution.

Clean and simple solution that worked perfectly from the go. Thanks!

Thanks!

If they need to disappear with the buttons just assign to the Header as follows.

header: {
   left: '',
   center: 'title',
   right: ''
 },

Thanks a lot!