In a database I have the info of some events but I want to add them automatically when I enter the calendar page. The problem is that it gives me an error and I can't solve it. my intention is that events are added on the other hand and from the calendar they can all be viewed. The Error is as follows:
index.php?acc=calendario:73 [Violation]'DOMContentLoaded' handler took 289ms
[Violation]Forced reflow while executing JavaScript took 46ms
main.js:6476 GET http://localhost/xampp/App-produccion/App%20produccion%202.8/calendario/cargarevento.php?start=2021-09-26T00%3A00%3A00%2B02%3A00&end=2021-11-07T00%3A00%3A00%2B01%3A00 404 (Not Found)
requestJson @ main.js:6476
fetch @ main.js:6517
fetchSource @ main.js:6105
fetchSourcesByIds @ main.js:6093
fetchDirtySources @ main.js:6076
addSources @ main.js:6068
initEventSources @ main.js:6019
CalendarDataManager @ main.js:6941
Calendar @ main.js:9635
(anónimo) @ index.php?acc=calendario:77
main.js:6126 Request failed {message: 'Request failed', xhr: XMLHttpRequest}
(anónimo) @ main.js:6126
(anónimo) @ main.js:6520
xhr.onload @ main.js:6470
load (asincrónica)
requestJson @ main.js:6451
fetch @ main.js:6517
fetchSource @ main.js:6105
fetchSourcesByIds @ main.js:6093
fetchDirtySources @ main.js:6076
addSources @ main.js:6068
initEventSources @ main.js:6019
CalendarDataManager @ main.js:6941
Calendar @ main.js:9635
(anónimo) @ index.php?acc=calendario:77
And these are the codes:
<html>
<head>
<title>Calendar</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link id="logonsgs" rel='icon' type="image/ico" href='web/img/produccion.ico' />
<!-- CSS -->
<link type="text/css" rel="stylesheet" href="librerias/fullcalendar/main.css" media="screen,projection" /><!-- Scripts-->
<script src="web/js/jquery.min.js"></script>
<script src="web/js/material.min.js"></script>
<script src="web/js/jquery-3.5.1.js"></script>
<script src="web/js/jquery-confirm.js"></script>
<script src="web/js/jquery.dataTables.min.js"></script>
<script src="web/js/dataTables.material.min.js"></script>
<script src="librerias/jsPDF/jspdf.min.js"></script>
<script src="librerias/jsPDF/jspdf.debug.js"></script>
<script src="librerias/fullcalendar/main.js"></script>
<script src="librerias/fullcalendar/locales-all.js"></script>
<!--<script src="librerias/fullcalendar/locales/es.js"></script>-->
</head>
<body>
<div id='calendar'></div>
<style>
html,
body {
margin: 0;
padding: 0;
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
font-size: 14px;
}
#calendar {
max-width: 1100px;
margin: 40px auto;
}
</style>
<script>
var today = 2021-10-07;
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth',
initialDate: today,
headerToolbar: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay'
},
locales: 'es',
events: "cargarevento.php"
});
calendar.render();
});
</script>
</body>
</html>
and the following is the one that supposedly calls the data:
It is also where I connect to the database and is called by the code above. Here what I do is generate an array and then pass it to the previous one, then I should do a loop to be able to send all the records
<?php
$host = '127.0.0.1';
$db = 'produccion';
$user = 'root';
$pass = '';
$port = "3306";
$charset = 'utf8';
$options = [
\PDO::ATTR_ERRMODE => \PDO::ERRMODE_EXCEPTION,
\PDO::ATTR_DEFAULT_FETCH_MODE => \PDO::FETCH_ASSOC,
\PDO::ATTR_EMULATE_PREPARES => false,
];
$dsn = "mysql:host=127.0.0.1:3306;dbname=$db;charset=$charset;";
try {
$pdo = new \PDO($dsn, $user, $pass);
} catch (PDOException $e) {
throw new PDOException($e->getMessage(), (int)$e->getCode());
}
$data = array();
$query = "SELECT PID, INICIO, FIN FROM calendario ORDER BY PID;";
$statement = $pdo->prepare($query);
$statement->execute();
$result = $statement->fetchAll();
json_encode($data);
foreach($result as $row)
{
$data[] = array(
'title' => $row["PID"],
'start' => $row["INICIO"],
'end' => $row["FIN"]
);
};
json_encode($data);
?>