Estoy tratando con 2 archivos php que son tabs.php y timetable.php. tabs.php actúa como una barra de navegación y dirige al usuario a muchas páginas, incluido timetable.php. Mientras que timetable.php tiene un FullCalendar que funciona perfectamente. La forma en que dirijo al usuario de tabs.php a timetable.php es la siguiente:
<li><button class="tablink" onclick="openPage('Timetable', this)"id="defaultOpen4">Timetable</button></li> <div id="Timetable" class="tabcontent"> <?php include("timetable.php"); ?> </div>El script para FullCalendar es el siguiente:
<script> $(document).ready(function() { $('#calendar').fullCalendar({ editable: false, //Prevents user from moving around events header: { left: 'prev, next today', center: 'title', right: 'month, agendaWeek, agendaDay' }, events: function(start, end, timezone, callback) { $.ajax({ url: 'loadEventsStudent.php', dataType: 'json', data: {}, success: function(data) { var events = []; for (var i = 0; i < data.length; i++) { events.push({ title: data[i]['class'], start: data[i]['start_event'], end: data[i]['end_event'], }); } //adding the callback callback(events); } }); } }); }); </script>El problema es que cuando voy a la página de horarios, solo se ven los botones del calendario. Una vez que hago clic en cualquiera de estos botones, el calendario se procesa. El script para FullCalendar funciona perfectamente bien, ya que intenté ejecutarlo en otro archivo, lo que me hace pensar que la expresión de inclusión está causando este problema. Cuando trato de inspeccionar la pestaña Red de mi navegador, noté que una vez que abro la página del horario, no pasa nada, pero una vez que hago clic en cualquiera de los botones de los calendarios, aparece el archivo loadEventsStudent.php (almacena datos de una base de datos). y luego se renderiza el calendario. ¿Hay alguna manera de hacer que el calendario se represente sin tener que cambiar la forma en que se conectan ambos archivos?
Esto se debe a que include() es una función de PHP y el código HTML de su calendario ya está cargado en el navegador.
La solución rápida que sugeriría es activar un clic en los botones del calendario cuando esté viendo la página, para que pueda cargar los eventos del calendario cuando esté visitando la pestaña del calendario.
$( document ).ready(function() { // Your code for the calendar comes here $("#defaultOpen4").on("click", function() { $( ".class-of-the-calendar-button" ).trigger( "click" ); }); });