0

Estoy intentando realizar un calendario de eventos con fullcalendar y php. Tengo unos datos guardados en una BD los cuales quiero mostrar en el calendario, pero por más que intento no logro que se muestren la consola del navegador. Lo único que me marca es esta advertencia:

Failure parsing JSON {message: 'Failure parsing JSON', xhr: XMLHttpRequest}

El código php que utilizo es

 $query = $conn->prepare("SELECT * FROM eventos");
 $query->execute();
 $resultado = $query->get_result();

 $eventos = [];

while($row_events = mysqli_fetch_array($resultado)){
    $title = $row_events['title'];
    $color = $row_events['color'];
    $eventos[] = [
        'title' => $title, 
        'color' => $color, 
        ];
}
echo json_encode($eventos);

codigo js para mostrar eventos

  document.addEventListener('DOMContentLoaded', function() {
            var calendarEl = document.getElementById('calendar');
            var calendar = new FullCalendar.Calendar(calendarEl, {
                //creando vistas semana dia
                headerToolbar: {
                    left: 'prev,next today,boton',
                    right: 'dayGridMonth,dayGridWeek,list',
                    center: 'title',
                },
                events: {
                    url: 'logica/eventos.php',
                    
                }
            });
            //cambiar idioma a espanol
            calendar.setOption('locale', 'Es');
            calendar.render();
        });

He buscado por todas partes y realmente no sé cuál es mi error.
Un último dato: eventos.php me devuelve lo siguiente

[{"title":"titulo","color":"#FF5722"},{"title":"azsdasdas","color":"#8BC34A"}]

Version full calendar: 5 Version php: 8

Update: Eh probado con alguna de las sugerencias hechas y aun sigo sin poder resolver esto. Por si sirve de algo adjunto lo que me marca pestaña de network. No entiendo bien pero creo que si esta recibiendo los datos o si alguien puede orientarme. Gracias.

introducir la descripción de la imagen aquí

2
  • Que version de Fullcalendar estas utilizando
    – Aleman
    Commented el 24 jun. 2022 a las 6:23
  • Hola gracias por responder version 5 Commented el 24 jun. 2022 a las 14:57

1 respuesta 1

0

Hacen falta datos :

  • Versión Fullcalendar
  • Versión php

Para ver realmente lo que esta sucediendo en las herramientas de desarrollo del navegador tienes la pestaña network y ahí tendras la subpestaña Fetch/HRX en ella encontraras el estado de la solicitud a logica/eventos.php

No tienes errores en el código pero : Hay varios campos que hacen falta

  $eventos[] = [
        'id'=> 1,
        'title'=> "Envento de prueba",
        'start'=> date("Y-m-d) . "T" . "13:00" ,
        'end' => date("Y-m-d) . "T" . "13:30",
        'color' => "#FAFAFA#,
    ];

En cuanto a la respuesta : agrega en los headers el código de respuesta y el tipo de respuesta

  header("Content-Type: application/json");
  http_response_code(200);
  echo json_encode($datosPaciente);
  exit;

Concejos que no has pedido :

Recuerda que fullcalendar envía un rango de fechas como parámetros por la url puedes utilizar estos datos para hacer tu consulta a la base de datos mas rapido

Obtenemos el rango de fechas

$start = explode("T",$_GET['start'])[0];
$end   = explode("T",$_GET['end'])[0];

Mejoramos el select

//Asumo que la fecha de inicio  y fin de cada cita la guardas en dos campos separados
     $query = $conn->prepare("SELECT * FROM eventos where fechaInicio >= '$start' and fechaFin <= '$end'");
2
  • gracias intentare poner en practica los consejos por cierto la version de php que uso es la 8 y full calendar v5 Commented el 24 jun. 2022 a las 14:58
  • @FerDaniela No olvides marcar la respuesta
    – Aleman
    Commented el 28 jun. 2022 a las 8:17

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.