This may seem a little basic but here is my issue.
function output_calendar($month, $year) {
/* draw table */
$calendar = '<table class="table table-bordered" cellpadding="0" cellspacing="0" class="calendar">';
/* table headings */
$headings = array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
$calendar.= '<tr><td>'.implode('</td><td>',$headings).'</td></tr>';
/* days and weeks vars now ... */
$running_day = date('w',mktime(0,0,0,$month,1,$year));
$days_in_month = date('t',mktime(0,0,0,$month,1,$year));
$days_in_this_week = 1;
$day_counter = 0;
$dates_array = array();
/* row for week one */
$calendar.= '<tr>';
/* print "blank" days until the first of the current week */
for($x = 0; $x < $running_day; $x++):
$calendar.= '<td> </td>';
$days_in_this_week++;
endfor;
/* keep going with days.... */
for($list_day = 1; $list_day <= $days_in_month; $list_day++):
$calendar.= '<td style="width:14%;height:10%;">';
/* add in the day number */
$calendar.= '<div>'.$list_day.'</div>';
/** QUERY THE DATABASE FOR AN ENTRY FOR THIS DAY !! IF MATCHES FOUND, PRINT THEM !! **/
$calendar.= str_repeat('<p> </p>',2);
$calendar.= '</td>';
if($running_day == 6):
$calendar.= '</tr>';
if(($day_counter+1) != $days_in_month):
$calendar.= '<tr>';
endif;
$running_day = -1;
$days_in_this_week = 0;
endif;
$days_in_this_week++; $running_day++; $day_counter++;
endfor;
/* finish the rest of the days in the week */
if($days_in_this_week < 8):
for($x = 1; $x <= (8 - $days_in_this_week); $x++):
$calendar.= '<td> </td>';
endfor;
endif;
/* final row */
$calendar.= '</tr>';
/* end the table */
$calendar.= '</table>';
/* all done, return result */
return $calendar;
}
Front End JS
$(document).ready(function () {
$(document).on('click', '#next', function() {
$("#main").empty();
if(display_month < 12) {
display_month++;
} else {
display_month = 1;
display_year++;
}
getCal(display_month, display_year);
$('#title').empty();
$('#title').html(months[display_month].concat(' ').concat(display_year));
});
$(document).on('click', '#last', function() {
$("#main").empty();
if(display_month > 1) {
display_month--;
} else {
display_month = 12;
display_year--;
}
getCal(display_month, display_year);
$('#title').empty();
$('#title').html(months[display_month].concat(' ').concat(display_year));
});
});
// handles the click event, sends the query
function getCal(v1, v2) {
$.ajax({
url: "calGrab.php",
type: 'POST',
dataType: 'html',
data: content,
data: {
"month": display_month,
"year": display_year,
},
}).done(function ( data ) {
$('#main').empty();
$('#main').append(data);
});
}
How do I go about correctly lining up the date with the associated day. For example, August starts on a Saturday for 2015. Are there any known techniques for this?
Please see prototype: http://calendar.conneraiken.com