Tabla Bootstrap que muestra datos JSON
Estoy ejecutando Bootstrap en mi sitio, combinado con un complemento de bootstrap llamadoTablas Bootstrap. Solicita que los datos se entreguen como un archivo JSON.
Sin embargo, tengo problemas para que funcione. He estado intentando por un día completo ahora, pero sin resultado. También probé Google y otros ejemplos de código.
Mi archivo JSON se parece a
{"giveawayid":"101", "creatorid":"7962290569"}
Mi página de prueba se ve así:
<html lang="en">
<head>
<!-- Latest compiled and minified JavaScript -->
<script src="js/jquery-1.11.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-table.js"></script>
<!-- Bootstrap - Latest compiled and minified CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-table.css">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Test</title>
</head>
<body>
<p> </p>
<div class="container">
<!-- table -->
<table class='table' data-toggle="table" data-url="test.json">
<thead>
<TR>
<TH data-field="giveawayid" data-align="center" data-sortable="true">giveawayid</TH>
<TH data-field="creatorid" data-align="center" data-sortable="true">creatorid</TH>
</TR>
</thead>
</table>
</div>
</body></html>
Ahora, como puede ver en los encabezados ordenables, el JavaScript de la tabla Bootstrap está activo.
También revisé los archivos JSON y, aunque los hice yo mismo, parecen válidos. Sin embargo, el sistema no parece manejar los datos. ¿Cómo puedo estar seguro de que los archivos json son correctos? Lo verifiqué con las herramientas de desarrollador y no vi ningún error.
¿Alguien tiene alguna idea de lo que podría estar yendo mal?
Editar: Solución a continuación