Retour d'un tableau JSON à partir D'une vue Django vers un modèle
J'utilise Django pour créer une application web pour un projet, et je rencontre des problèmes renvoyant un tableau d'une vue Django à un modèle.
Le tableau sera utilisé par un script JavaScript (JQuery) pour dessiner des boîtes sur une image affichée dans la page. Par conséquent, ce tableau aura, entre autres, des coordonnées pour les boîtes à dessiner.
C'est le code de la vue Django utilisé pour obtenir les données requises et les sérialiser en JSON:
def annotate(request, ...):
...
oldAnnotations = lastFrame.videoannotation_set.filter(ParentVideoLabel=label)
tags = serializers.serialize("json", oldAnnotations)
...
return render_to_response('vannotate.html', {'tags': tags, ...})
Comme un moyen de débogage, l'utilisation de {{ tags }} dans la partie HTML du modèle donne ceci en sortie (désolé pour la longue ligne):
[{"pk": 491, "model": "va.videoannotation", "fields": {"ParentVideoFile": 4, "ParentVideoFrame": 201, "ParentVideoLabel": 4, "top": 220, "height": 30, "width": 30, "ParentVideoSequence": 16, "left": 242}}, {"pk": 492, "model": "va.videoannotation", "fields": {"ParentVideoFile": 4, "ParentVideoFrame": 201, "ParentVideoLabel": 4, "top": 218, "height": 30, "width": 30, "ParentVideoSequence": 16, "left": 307}}]
Que je suppose est le format correct pour un tableau JSON.
Plus Tard dans le modèle, j'essaie d'utiliser la variable tags dans la partie JavaScript du modèle, comme suit:
{% if tags %}
var tagbs = {{ tags|safe }};
var tgs = JSON.parse(tagbs);
alert("done");
{% endif %}
Si je supprime la ligne var tgs = JSON.parse(tagbs);, la boîte d'alerte apparaît correctement et le reste du JavaScript fonctionne comme prévu. Laisser cette ligne dans casse le script, cependant.
Je vous voulez pouvoir parcourir tous les objets du modèle Django et obtenir des valeurs de champs en JavaScript.
Je ne suis pas sûr de ce que je fais mal ici, quelqu'un pourrait-il indiquer la bonne façon de le faire?
3 réponses
JSON est code source Javascript. C'est-à-dire que la représentation JSON d'un tableau est le code source Javascript dont vous avez besoin pour définir le tableau.
Donc après:
var tagbs = {{ tags|safe }};
tagbs est un tableau JavaScript contenant les données que vous souhaitez. Il n'y a pas besoin d'appeler JSON.parse (), car le navigateur Web l'a déjà analysé en tant que code source JavaScript.
Donc vous devriez être capable de faire
var tagbs = {{ tags|safe }};
alert(tagbs[0].fields.ParentVideoFile);
Et cela devrait montrer "4".
Vous voulez JSON-identifier les données dans le modèle; JSON est déjà Javascript vraiment (c'est un sous-ensemble:
{% if tags %}
var tgs = {{ tags }};
{% endif %}
Notez que tags est déjà des données JSON (donc JavaScript) et peut être insérée directement ; pas besoin d'échapper (il n'y a pas de HTML ici, C'est JavaScript à la place).
Ou vous pouvez utiliser cet extrait Django et le faire directement dans le modèle (pas besoin d'appeler serializers.serialize dans la méthode annotate):
var tgs = {{ tags|jsonify }};
Vous pouvez aussi utiliser simplejson à partir de django.utils. Comme:
oldAnnotations = lastFrame.videoannotation_set.filter(ParentVideoLabel=label)
dump = simplejson.dumps(oldAnnotations)
return HttpResponse(dump, mimetype='application/json')
Vous pouvez analyser et atteindre toutes les données du côté JS.