javascript - run - google cloud sdk documentation
Variables de plantilla Django y Javascript (8)
Cuando renderizo una página usando el renderizador de plantillas de Django, puedo pasar una variable de diccionario que contiene varios valores para manipularlos en la página usando {{ myVar }}
.
¿Hay alguna manera de acceder a la misma variable en Javascript (quizás usando el DOM, no sé cómo Django hace que las variables sean accesibles)? Quiero poder buscar detalles usando una búsqueda AJAX basada en los valores contenidos en las variables pasadas.
Cuando Django devuelve la variable, convierte todas las comillas en "
. El uso de {{someDjangoVariable|safe}}
causa un error de Javascript.
Para solucionar este problema, utiliza .replace
Javascript:
<script type="text/javascript">
var json = "{{someDjangoVariable}}".replace(/"/g,"/"")
</script>
Estaba enfrentando un problema similar y la respuesta sugerida por S.Lott funcionó para mí.
<script type="text/javascript">
var a = "{{someDjangoVariable}}"
</script>
Sin embargo, me gustaría señalar una importante limitación de implementación aquí. Si planea colocar su código de JavaScript en un archivo diferente e incluir ese archivo en su plantilla. Esto no funcionará
Esto funciona solo cuando la plantilla principal y el código de JavaScript están en el mismo archivo. Probablemente el equipo de django pueda abordar esta limitación.
Esto es lo que estoy haciendo muy fácilmente: modifiqué mi archivo base.html para mi plantilla y lo puse en la parte inferior:
{% if DJdata %}
<script type="text/javascript">
(function () {window.DJdata = {{DJdata|safe}};})();
</script>
{% endif %}
luego cuando quiero usar una variable en los archivos javascript, creo un diccionario DJdata y lo agrego al contexto con un json: context[''DJdata''] = json.dumps(DJdata)
¡Espero eso ayude!
La {{variable}}
se sustituye directamente en el HTML. Hacer una fuente de vista; no es una "variable" ni nada por el estilo. Es solo texto renderizado.
Habiendo dicho eso, puedes poner este tipo de sustitución en tu JavaScript.
<script type="text/javascript">
var a = "{{someDjangoVariable}}";
</script>
Esto le da javascript "dinámico".
Para un diccionario, lo mejor es codificar a JSON primero. Puede usar simplejson.dumps () o si desea convertir desde un modelo de datos en App Engine, puede usar encode () desde la biblioteca GQLEncoder.
Para un objeto de JavaScript almacenado en un campo de Django como texto, que necesita convertirse nuevamente en un objeto de JavaScript insertado dinámicamente en el script de la página, debe usar tanto escapejs
como JSON.parse()
:
var CropOpts = JSON.parse("{{ profile.last_crop_coords|escapejs }}");
El escapejs
de Django maneja las escapejs
correctamente, y JSON.parse()
convierte la cadena nuevamente en un objeto JS.
Una solución que funcionó para mí es usar el campo de entrada oculto en la plantilla
<input type="hidden" id="myVar" name="variable" value="{{ variable }}">
Luego, obteniendo el valor en javascript de esta manera,
var myVar = document.getElementById("myVar").value;
PRECAUCIÓN Compruebe el ticket n #17419 para obtener información sobre #17419 agregar una etiqueta similar en Django core y las posibles vulnerabilidades XSS introducidas al usar esta etiqueta de plantilla con los datos generados por el usuario. Comment de amacneil discute la mayoría de las preocupaciones planteadas en el boleto.
Creo que la forma más flexible y práctica de hacerlo es definir un filtro de plantilla para las variables que desea usar en el código JS. Esto le permite asegurarse de que sus datos se hayan escapado correctamente y que pueda usarlos con estructuras de datos complejas, como dict
y list
. Es por eso que escribo esta respuesta a pesar de que hay una respuesta aceptada con muchos votos ascendentes.
Aquí hay un ejemplo de filtro de plantilla:
// myapp/templatetags/js.py
from django.utils.safestring import mark_safe
from django.template import Library
import json
register = Library()
@register.filter(is_safe=True)
def js(obj):
return mark_safe(json.dumps(obj))
Esta plantilla filtra convierte variable a cadena JSON. Puedes usarlo así:
// myapp/templates/example.html
{% load js %}
<script type="text/javascript">
var someVar = {{ some_var | js }};
</script>