7
votes

Django: mise à jour de div avec ajax

Je construis une application de discussion. Jusqu'à présent, j'ajoute des messages de discussion avec jQuery $ .post () et cela fonctionne bien.

Maintenant, j'ai besoin de récupérer le dernier message de discussion de la table et appendez la liste sur la page de discussion. Je suis nouveau à Django, alors s'il vous plaît, allez lentement.

Alors, comment puis-je obtenir des données de la table de discussion vers la page de discussion?

Merci d'avance!

django python django-templates jquery ajax

0 commentaires

3 Réponses :

2
votes

Puisque vous utilisez déjà un message Ajax, pourquoi ne retournez-vous pas les données de cela et insérez-la dans la DIV? La vue qui accepte le message peut renvoyer un modèle rendu ou JSON et votre JavaScript peut l'insérer dans le rappel.

1 commentaires

Salut là-bas daniel! Alors je vais simplement ajouter () la div avec la valeur? J'ai besoin de mettre à jour le div avec les derniers messages toutes les x secondes ..

13
votes

Ma technique préférée pour ce genre de chose est d'utiliser un Étiquette d'inclusion

Fondamentalement, vous créez un modèle distinct pour rendant les objets individuels du modèle de page P>

Modèle de page: P>

$.post(url_of_ajax_view, request_data, function(data, status) {
    if (status == 'success') {
        $(".message_list").append(data);
    }
});

0 commentaires

2
votes

Il y a beaucoup de choses pour que ce processus fonctionne ...

Le client interroge régulièrement le serveur pour les nouvelles entrées de discussion li>
Le serveur vérifie et ne répond que avec le dernier l>

Le client reçoit les nouvelles entrées et les ajoute à la DOM LI> ul>

Cela peut être déroutant lorsque vous commencez par commencer car il n'est pas toujours clair ce que le client fait et ce que le serveur fait, mais si le grand problème est décomposé, je pense que vous trouverez que c'est un processus simple . P>

Si le client va interroger régulièrement le serveur pour de nouvelles entrées de discussion, le serveur (Django) doit alors avoir un type d'API à le faire. Votre plus grande décision sera ce que le type de données est le retour du serveur. Vous pouvez choisir parmi: rendu HTML, XML, YAML ou JSON. Le poids le plus léger est JSON, et il est soutenu par la plupart des principaux cadres JavaScript (et Django inclut un sérialiseur JSON puisqu'il est aussi génial). P>

<!-- I'm assuming you're using jQuery -->
<script type="text/javascript">

    LATEST_CHAT_URL = '{% url get_latest_chat 5 %}';

    // On page start...
    $(function() {
        // Start a timer that will call our API at regular intervals
        // The 2nd value is the time in milliseconds, so 5000 = 5 seconds
        setTimeout(updateChat, 5000)
    });

    function updateChat() {
        $.getJSON(LATEST_CHAT_URL, function(data){
            // Enumerate JSON objects
            $.each(data.items, function(i,item){
                var newChatLine = $('<span class="chat"></span>');
                newChatLine.append('<span class="user">' + item.screenname + '</span>');
                newChatLine.append('<span class="text">' + item.text + '</span>');
                $('#chatbox').append(newChatLine);
            });
        });
    }

</script>

<div id="chatbox">
</div>

0 commentaires