Tengo una plantilla de Django con un menú AJAX (donde al hacer clic en diferentes elementos del menú se recarga una parte de la página). Cada clic en el menú invoca una función de visualización de Django a través de AJAX y devuelve algunos datos que se mostrarán en la página.
Estoy cargando todo el JS requerido para todos los elementos del menú en la página principal solamente (ya que aprendí que no es una buena idea que AJAX devuelva JS en un <div> y luego use eval() para ejecutarlo). Dado que estoy cargando todo el JS solo en la página principal del menú, los datos obviamente no están allí para otras opciones de menú al principio, ya que vendrán más tarde cuando se invoque la vista correspondiente (cuando se haga clic en la opción de menú)
Por eso, un código como el siguiente da un error de sintaxis en la consola ya que JS se analiza solo la primera vez.
<script> var data = {{se_data|safe}}; </script> Ahora no puedo usar los datos devueltos por la vista, incluso después de hacer clic en las opciones del menú, ya que el análisis de JS falló en primer lugar. Intenté usar if para ejecutar el código solo cuando se selecciona la opción de menú correspondiente, pero eso tampoco funciona ya que el analizador simplemente analiza todo.
He estado probando diferentes métodos para solucionar el problema, pero parece que no puedo encontrar una manera eficiente de resolverlo. Una alternativa podría ser hacer que la función de visualización devuelva todos los datos al principio, pero me temo que las opciones de menú y los datos devueltos pueden crecer con el tiempo, lo que retrasa la carga inicial de la página del menú principal.
Esta es la función de clic del menú ajax:
$(".ent-menu li a").click(function(e) { e.preventDefault(); // prevent from going to the page mentioned in href // get the href var href = $(this).attr("href"); $("#data_container").load(href, function() { load_data(); //this function uses the data variable defined earlier }); });Error que veo en la consola al cargar la página principal del menú:
Uncaught SyntaxError: Unexpected token ; at line 1110 data = ;ya que los datos aún no están disponibles.
Como se discutió, debe usar JSON para enviar los datos de Python a JS; use JSON.parse() para deserializar los datos para usarlos en su JS.