JSon Invalid en Datatable. Como solucionarlo
Bienvenidos a Vertutoriales y a esta serie de tutoriales relacionados con Datatables, en esta ocasión vamos a ver como depurar y detectar exactamente donde radica el problema del JSon Invalid que nos devuelve el método de conexión AJAX de la datatable.
Es más que típico que durante la programación de nuestra datatable lleguemos a sufrir algún imprevisto por la carga de datos, una muy común es que la Datatable no recibe el JSon esperado y como tal da un problema bastante claro que nos dice que visitemos la página http://datatables.net/tn/1. Lo único que encontraremos en esta página es como ha de recibir la información la datatable para “solucionar” el formato inválido.
Yo os traigo un pasito más, ya que puede ser que estemos montando correctamente el JSon que necesita nuestra datatable, pero por algún motivo diferente no lo pueda estar montando, para ello hace falta depurar y ver la respuesta que nos ofrece la llamada AJAX y como tal, evaluar las posibles soluciones.
En el caso que muestro en vídeo, al pulsar el botón derecho e inspeccionar elemento (mostrar la consola del navegador) selecciono network para ver la comunicación que hay. Cuando lanzo la llamada, selecciono response y analizo el resultado. En nuestro caso está en el propio SQL que llama a la base de datos, no existe un campo que estoy intentando cargar, por lo que PHP devuelve error y lo incrusta en el resultado devuelto. Esto a su vez es un JSon Invalid.
A continuación avanzo otro poco más y vemos que tampoco toma correctamente la carga de datos, en realidad está el JSon ya solucionado, pero el DATA que recibe la datatable está cambiado, ya que el campo que estaba intentando cargar posee otro nombre, el mismo que se estaba llamando en la SQL, así que simplemente se cambia por el correcto y listo.
¿Sencillo no? Depurar las llamadas y los resultados puede ahorrar mucho tiempo si sabéis trabajar de esta manera.
Como siempre, espero que os sirva. Si queréis agradecerlo podéis hacer me gusta o compartir este artículo, sino, podéis también comentar como mejorar. Ni que decir, si tenéis cualquier consulta podéis realizarla desde los comentarios del tutorial.
Comments
Hola amigo te agradecería bastante si me pudieses ayudar, mi problema es que no me muestra los resultados.
//este es mi html
Nombre
Apellido Paterno
Apellido Materno
DNI
Celular
Teléfono
Email
Dirección
Mod.
Hab. / Inh.
Nombre
Apellido Paterno
Apellido Materno
DNI
Celular
Teléfono
Email
Dirección
Mod.
Hab. / Inh.
//este es mi ajax
function lista_personal()
{
$.ajax({
url: “../conexion/conexion_persona.php”,
type: “POST”,
async: false,
cache: false,
data:
{
lista_personal: 1
},
success: function (re)
{
$(‘#lista_personal’).html(re);
}
});
}
//este es mi conexion con la base de datos
if (isset($_POST[‘lista_personal’])) {
$sql = “select * from personal”;
$result = mysql_query($sql);
while ($row = mysql_fetch_object($result)) {
echo ”
$row->nombre
$row->apellido_pat
$row->apellido_mat
$row->nro_doc_identific
$row->celular
$row->telefono
$row->email
$row->direccion
idpersona’ class=’mosProfe’>
“;
if($row->estado==’1′){
echo ”
idcomida’ class=’inhprof’>
“;
}else{
echo ”
idcomida’ class=’habprof’>
“;
}
$count++;
}
exit();
}
Revisa varias cosas:
– Prueba a igualar el valor del enlace a una variable y a concatenarlo, en vez de ponerlo todo de seguido.
– Tienes 9 o 10 columnas? de bbdd devuelves 10.
– La estructura que tiene que devolver es muy concreta, revisa el tutorial, por que creo que ahí tienes otro problemas 😉
Hola un cordial saludo, bueno he probado tu código y no logro hacer que me funcione, me genera la advertencia que te muestra en el vídeo, tal ves puedas ayudarme.
Este el código que utilizo:
id
examen
precio
Este es el script de datatables.
$(document).ready(function() {
$(‘#example’).DataTable( {
“ajax”:”precios_datatable.php”,
“columns”: [
{“data”: “id”},
{“data”: “examen”},
{“data”: “precio”}
]
} );
} );
y este es el archivo php.
?>
El archivo PHP no puedo verlo 🙁
Pero seguro que está malformando la información a devolver
Disculpa ya me funciona, un cordial saludo.
Perfecto 🙂
Buenas noches, he seguido al pie de la letra el tutorial para subsanar el error he probado tu código y no logro hacer que me funcione, sigue el mensaje de advertencia.
Archivo listar.php
query($query);
if (!$resultado){
die(“error”);
}
else{
$arreglo[“data”] = [];
while ($data=mysqli_fetch_assoc($resultado)){
$arreglo[“data”][] = $data;
}
echo json_encode($arreglo);
}
mysqli_free_result($resultado);
mysqli_close($mysqli);
?>
Archivo indice1.html
$(document).on(“ready”, function(){
listar();
});
var listar = function(){
var table = $(‘#dt_usuario’).DataTable({
“ajax” : {
“method” : “POST”,
“URL” : “listar.php”
},
“columns” : [
{“data” : “usuario”},
{“data” : “nombre”},
{“data” : “correo”}
]
});
}
Si el problema es invalid json, el problema lo tienes en el php, has mirado en el inspector lo que está devolviendo esa consulta?