I am trying to create a function where my php calendar can be updated. This set of code is supposed to send $_POST["showmonth"] and $_POST["showyear"] to the controller but apparently it isn't working, causing the undefined index error. To be honest I am a total newbie in javascript and was just follow a tutorial on youtube. There are 2 similar functions for next and last month which are activated by the onClick trigger.Does anyone have any suggestion as to what the problem may be?
I am getting the error on line 9 and 10 of my php file,which where i announced
$showmonth = $_POST['showmonth']; and $showyear = $_POST['showyear'];
Notice: Undefined index: showmonth in /home/jharvard/vhosts/localhost/html/calendar_start.php on line 9
<script language="JavaScript" type="text/javascript">
function intialCalendar(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
var url = "calendar_start.php";
var currentTime = new Date();
var month = currentTime.getMonth()+1;
var year = currentTime.getFullYear();
showmonth = month;
showyear = year;
var vars = "showmonth="+showmonth+"&showyear="+showyear;
hr.open("POST",url, true);
// Set content type header information for sending url encoded variables in the request
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("showCalendar").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(vars); // Actually execute the request
document.getElementById("showCalendar").innerHTML = "processing...";
}
</script>
This is my html file
<!DOCTYPE html>
<html>
<head>
<link href="css/bootstrap.css" rel="stylesheet"/>
<link href="css/bootstrap-responsive.css" rel="stylesheet"/>
<link href="css/styles.css" rel="stylesheet"/>
<link href="css/calcss.css" rel="stylesheet" type= "text/css" media = "all"/>
<?php if (isset($title)): ?>
<title>Calendar: <?= htmlspecialchars($title) ?></title>
<?php else: ?>
<title>Calendar</title>
<?php endif ?>
<script src="js/jquery-1.8.2.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/scripts.js"></script>
<script src="js/calendar_functions.js"></script>
</head>
<body onload="initialCalendar();">
<div class="container-fluid">
<div id="top">
<a href="calendar_start.php"><img alt="Calendar" src="img/square.png"/></a>
</div>
<div id="middle">
<div id="showCalendar"></div>
This is my php file
<?php
// configuration
require("../includes/config.php");
require("../templates/show_calendar.php");
$showmonth = $_POST['showmonth'];
$showyear = $_POST['showyear'];
$showmonth = preg_replace('#[^0-9]#i', '', $showmonth);
$showyear = preg_replace('#[^0-9]#i', '', $showyear);
$day_count = cal_days_in_month(CAL_GREGORIAN, $showmonth,$showyear);
$pre_days = date('w', mktime(0, 0, 0, $showmonth, 1, $showyear));
$post_days = (6-(date(mktime(0, 0, 0, $showmonth, $day_count, $showyear))));
echo '<div id="calendar_wrap">';
echo '<div class="previous_month"><input name="myBtn" type="submit" value="Previous Month" onclick="javascript:last_month();"></div>';
echo '<div class="next_month"><input name="myBtn" type="submit" value="Next Month" onclick="javascript:next_month();"></div>';
echo '<div class="title_bar">';
echo '<div class="showmonth">' . $showmonth . '/' . $showyear . '</div>';
echo '</div>';
echo '<div class="week_days">';
echo '<div class="days_of_week">Sun</div>';
echo '<div class="days_of_week">Mon</div>';
echo '<div class="days_of_week">Tue</div>';
echo '<div class="days_of_week">Wed</div>';
echo '<div class="days_of_week">Thur</div>';
echo '<div class="days_of_week">Fri</div>';
echo '<div class="days_of_week">Sat</div>';
echo '<div class="clear"></div>';
echo '</div>';
//previous month filler days
if($pre_days != 0)
{
for($i=1; $i<=$pre_days; $i++)
{
echo '<div class="non_cal_day"></div>';
}
}
//current month
for($i=1; $i<=$day_count; $i++)
{
echo '<div class="cal_day">';
echo '<div class="day_heading">'.$i.'</div>';
echo '</div>';
}
//next month filler days
if($post_days != 0)
{
for($i=1; $i<=$post_days; $i++)
{
echo '<div class="non_cal_day"></div>';
}
}
echo '</div>';
require("../templates/footer.php");
?>
Another source of error I suspect may be the use of require() to link my HTML with the controller(calendar_start.php), because it was the only difference between what I did and what the tutorial video taught. The video was using dreamweaver while i was using gedit and without using require() I do not know how to link the php file to the html file.