AJAX Calendar Loader Using jQuery
My good pal Austin needed help turning his static calendar into one that could change the month, using AJAX. The calendar itself was written in PHP. Here is the quick and easy solution I came up with for him, using jQuery:
$(document).ready(function() { // Create Date Object var jsDateObject = new Date(); // Create Calendar Object ( Holds all your variables, etc ) var jsCalendar = {}; jsCalendar.currentMonth = jsDateObject.getMonth(); // Controls the NEXT button $("#jsCalendarNext").click(function() { // Update Active Month jsCalendar.currentMonth++; if(jsCalendar.currentMonth>12) { jsCalendar.currentMonth=1; } // Get New Calendar ajaxUpdateCalendar(); }); // Controls the PREV button $("#jsCalendarPrev").click(function() { // Update Active Month jsCalendar.currentMonth--; if(jsCalendar.currentMonth<1) { jsCalendar.currentMonth=12; } // Get New Calendar ajaxUpdateCalendar(); }); // Use AJAX to update the Calendar function ajaxUpdateCalendar() { $.post( "phpCalendarLoader.php", { calendarMonth: jsCalendar.currentMonth }, function(data) { $("#jsCalendarContainer").html(data); }, "html" ); } });
From here, all Austin had to do was set his $month variable to $_POST['calendarMonth'];.
