Estoy tratando de generar una respuesta Json en un sitio html usando AJAX pero sigo recibiendo el error:
Uncaught ReferenceError: data is not defined at HTMLDocument.<anonymous
JsonResponse en la pregunta:
["[53.50119612705815, -1.1270833894501477] -> [53.34474, -3.01101]", "[53.50119612705815, -1.1270833894501477] -> [53.34474, -3.01101]", "[52.04061648544843, -0.6655072691644374] -> [51.90829, -0.5127]", "[52.04061648544843, -0.6655072691644374] -> [51.90829, -0.5127]", "[52.04061648544843, -0.6655072691644374] -> [51.90829, -0.5127]", "[53.50119612705815, -1.1270833894501477] -> [53.42705, -0.94339]"]
Archivo html con AJAX y JS:
<div class="'row"> <div id="test"> <h1> Test </h1> </div> </div> {% endblock %} {% block js %} <script> $(document).ready(function(){ $.ajax({ type: 'POST', dataType: 'json', url: '/network/dispatch_data/', data: data, success: function(response) { console.log(response); $('#test').append(response.data); } }); }); </script> {% endblock %}
Cuando inspecciono el elemento en mi navegador, el error apunta a los data: data
son la fuente del error. ¿Alguna idea de lo que estoy haciendo mal? Puedo ver la url perfectamente con la respuesta json, pero hacer que se muestre con ajax está demostrando ser un problema
Está enviando data
como el cuerpo de su solicitud, pero primero debe definir el objeto que está enviando a la API
<div class="row"> <div id="test"> <h1> Test </h1> </div> </div> {% endblock %} {% block js %} <script> const data = { bar: [1, 2, 3], foo: false } $(document).ready(function () { $.ajax({ type: 'POST', dataType: 'json', url: '/network/dispatch_data/', data: data, success: function (response) { console.log(response); $('#test').append(response.data); } }); }); </script> {% endblock %}