Maison interface Web js tutoriel Code d'implémentation pour Django Ajax soumettre des commentaires et actualiser automatiquement la fonction

Code d'implémentation pour Django Ajax soumettre des commentaires et actualiser automatiquement la fonction

May 22, 2018 pm 01:54 PM
ajax django 自动

Cet article présente principalement le code d'implémentation de la soumission de commentaires ajax de Django et la fonction d'actualisation automatique. Les amis qui en ont besoin peuvent s'y référer

Après avoir essayé plusieurs fois, je l'ai enfin compris, téléchargeons le code. (J'utilise l'ajax de jQuery, pas natif)

Code js :

<script>
 $(document).ready(function () {
  getcomment();
  $(&#39;.comment-box button&#39;).click(function () {
   var comment_text = $(&#39;.comment-box textarea&#39;).val();
   $.ajax({
    type: &#39;POST&#39;,
    url: &#39;/bbs/article/{{ article_list.id }}/comment/&#39;,
    data: {comment: comment_text},
    success:function (callback) {
     var data = $.parseJSON(callback);
     $(&#39;.callback&#39;).html(data.result);
     if(data.result === &#39;successfully&#39;) {
      getcomment();
     }
    }
   })
  });
 });
 function getcomment() {
  $.ajax({
   type: &#39;GET&#39;,
   url: &#39;/bbs/article/{{ article_list.id }}/get_comment/&#39;,
   success:function (call) {
    var datas = $.parseJSON(call);
    $(&#39;.comment-list&#39;).html(datas.answer);
   }
  })
 }
</script>
Copier après la connexion

Appelez la fonction getcomment() après le chargement du texte intégral pour obtenir les commentaires de la base de données, écrits par moi-même. Après le commentaire est soumis, appelez à nouveau la fonction getcomment() pour actualiser automatiquement le

modèle HTML (le modèle bootstrap est utilisé) :

 <p class="row">
   <p class="comment-list" style="margin-left: 10px">
   </p>
  </p>
  <p class="row">
 <article class="col-xs-12">
     <h4>请评论:</h4>
     <p class="comment-box">
      <textarea class="form-control" rows="3"></textarea>
      <span class="callback"></span><button type="submit" class="btn btn-success pull-right" style="max-width: 5px;">评论</button>
     </p>
 </article>
</p>
  <hr>
Copier après la connexion

Fonction View :

@csrf_exempt
def comment(request,article_id):
 if request.method == &#39;POST&#39;:
  comments = request.POST[&#39;comment&#39;]
  if len(comments) < 5:
   result = u&#39;评论数需大于5&#39;
   return HttpResponse(json.dumps({&#39;result&#39;: result}))
  else:
   result = &#39;successfully&#39;
   Comment.objects.create(content= comments, article_id=article_id)
   return HttpResponse(json.dumps({&#39;result&#39;: result}))
Copier après la connexion

C'est la fonction pour soumettre des commentaires. N'oubliez pas d'ajouter la fonction décorateur csrf

def get_comment(request, article_id):
 article_list = get_object_or_404(Article, id=article_id)
 comments = article_list.comment_set.all()
 html = &#39;&#39;
 for i in comments:
  ele = &#39;<p class="row"><article class="col-xs-12"><p class="pull-right"><span class="label label-default">作者:&#39; + &#39;i.user&#39; + &#39;</span></p><p>&#39; + i.content + &#39;<ul class="list-inline"><li><a href="#" rel="external nofollow" ></a></li></ul></article></p><hr>&#39;
  html += ele
 return HttpResponse(json.dumps({&#39;answer&#39;: html}))
Copier après la connexion

pour obtenir des commentaires en arrière-plan.

Effacez enfin la valeur textarea :

function resettext() {
 $(&#39;.form-control&#39;).val(&#39;&#39;);
}
Copier après la connexion

Ce qui précède est ce que j'ai compilé pour tout le monde. J'espère que cela sera utile à tout le monde à l'avenir.

Articles connexes :

La raison pour laquelle l'ajout d'un nombre aléatoire après l'adresse de requête ajax empêche la mise en cache du navigateur

JS efface le cache du navigateur IE Méthode

Résoudre le problème du navigateur qui mémorise les requêtes ajax et peut avancer et reculer

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

Repo: Comment relancer ses coéquipiers
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
4 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment résoudre l'erreur 403 rencontrée par la requête jQuery AJAX Comment résoudre l'erreur 403 rencontrée par la requête jQuery AJAX Feb 20, 2024 am 10:07 AM

Titre : Méthodes et exemples de code pour résoudre les erreurs 403 dans les requêtes jQuery AJAX L'erreur 403 fait référence à une demande selon laquelle le serveur interdit l'accès à une ressource. Cette erreur se produit généralement parce que la demande manque d'autorisations ou est rejetée par le serveur. Lorsque vous effectuez des requêtes jQueryAJAX, vous rencontrez parfois cette situation. Cet article explique comment résoudre ce problème et fournit des exemples de code. Solution : Vérifiez les autorisations : assurez-vous d'abord que l'adresse URL demandée est correcte et vérifiez que vous disposez des autorisations suffisantes pour accéder à la ressource.

Comment résoudre l'erreur 403 de la requête jQuery AJAX Comment résoudre l'erreur 403 de la requête jQuery AJAX Feb 19, 2024 pm 05:55 PM

jQuery est une bibliothèque JavaScript populaire utilisée pour simplifier le développement côté client. AJAX est une technologie qui envoie des requêtes asynchrones et interagit avec le serveur sans recharger la page Web entière. Cependant, lorsque vous utilisez jQuery pour effectuer des requêtes AJAX, vous rencontrez parfois des erreurs 403. Les erreurs 403 sont généralement des erreurs d'accès refusé par le serveur, probablement en raison de problèmes de politique de sécurité ou d'autorisation. Dans cet article, nous verrons comment résoudre la requête jQueryAJAX rencontrant une erreur 403.

Monter automatiquement les disques sous Linux Monter automatiquement les disques sous Linux Mar 20, 2024 am 11:30 AM

Si vous utilisez un système d'exploitation Linux et souhaitez que le système monte automatiquement un lecteur au démarrage, vous pouvez le faire en ajoutant l'identifiant unique (UID) du périphérique et le chemin du point de montage au fichier de configuration fstab. fstab est un fichier de table du système de fichiers situé dans le répertoire /etc. Il contient des informations sur les systèmes de fichiers qui doivent être montés au démarrage du système. En modifiant le fichier fstab, vous pouvez vous assurer que les lecteurs requis sont chargés correctement à chaque démarrage du système, garantissant ainsi un fonctionnement stable du système. Les pilotes à montage automatique peuvent être utilisés facilement dans diverses situations. Par exemple, je prévois de sauvegarder mon système sur un périphérique de stockage externe. Afin de réaliser l'automatisation, assurez-vous que l'appareil reste connecté au système, même au démarrage. De même, de nombreuses applications seront directement

Comment obtenir des variables de la méthode PHP en utilisant Ajax ? Comment obtenir des variables de la méthode PHP en utilisant Ajax ? Mar 09, 2024 pm 05:36 PM

L'utilisation d'Ajax pour obtenir des variables à partir de méthodes PHP est un scénario courant dans le développement Web. Grâce à Ajax, la page peut être obtenue dynamiquement sans actualiser les données. Dans cet article, nous présenterons comment utiliser Ajax pour obtenir des variables à partir de méthodes PHP et fournirons des exemples de code spécifiques. Tout d’abord, nous devons écrire un fichier PHP pour gérer la requête Ajax et renvoyer les variables requises. Voici un exemple de code pour un simple fichier PHP getData.php :

Comment résoudre le problème de l'erreur 403 jQuery AJAX ? Comment résoudre le problème de l'erreur 403 jQuery AJAX ? Feb 23, 2024 pm 04:27 PM

Comment résoudre le problème de l’erreur 403 jQueryAJAX ? Lors du développement d'applications Web, jQuery est souvent utilisé pour envoyer des requêtes asynchrones. Cependant, vous pouvez parfois rencontrer le code d'erreur 403 lors de l'utilisation de jQueryAJAX, indiquant que l'accès est interdit par le serveur. Cela est généralement dû aux paramètres de sécurité côté serveur, mais il existe des moyens de résoudre le problème. Cet article explique comment résoudre le problème de l'erreur 403 jQueryAJAX et fournit des exemples de code spécifiques. 1. faire

Comment utiliser le framework Django pour créer un projet dans PyCharm Comment utiliser le framework Django pour créer un projet dans PyCharm Feb 19, 2024 am 08:56 AM

Conseils sur la façon de créer des projets à l'aide du framework Django dans PyCharm, nécessitant des exemples de code spécifiques. Django est un puissant framework Web Python qui fournit une série d'outils et de fonctions pour le développement rapide d'applications Web. PyCharm est un environnement de développement intégré (IDE) développé en Python, qui fournit une série de fonctions et d'outils pratiques pour augmenter l'efficacité du développement. La combinaison de Django et PyCharm rend la création de projets plus rapide et plus pratique

Conseils Linux : annulez l'indentation automatique lors du collage dans vim Conseils Linux : annulez l'indentation automatique lors du collage dans vim Mar 07, 2024 am 08:30 AM

Préface : vim est un puissant outil d’édition de texte, très populaire sous Linux. Récemment, j'ai rencontré un problème étrange lors de l'utilisation de vim sur un autre serveur : lorsque j'ai copié et collé un script écrit localement dans un fichier vierge sur le serveur, une indentation automatique s'est produite. Pour utiliser un exemple simple, le script que j'ai écrit localement est le suivant : aaabbbcccddd. Lorsque je copie le contenu ci-dessus et que je le colle dans un fichier vierge sur le serveur, ce que j'obtiens est : aabbbcccddd. Évidemment, c'est ce que vim fait automatiquement. nous. Formater l'indentation. Cependant, cet automatique est un peu inintelligent. Enregistrez la solution ici. Solution : définissez le fichier de configuration .vimrc dans notre répertoire personnel, nouveau

PHP vs Ajax : solutions pour créer du contenu chargé dynamiquement PHP vs Ajax : solutions pour créer du contenu chargé dynamiquement Jun 06, 2024 pm 01:12 PM

Ajax (Asynchronous JavaScript et XML) permet d'ajouter du contenu dynamique sans recharger la page. En utilisant PHP et Ajax, vous pouvez charger dynamiquement une liste de produits : HTML crée une page avec un élément conteneur et la requête Ajax ajoute les données à l'élément après l'avoir chargé. JavaScript utilise Ajax pour envoyer une requête au serveur via XMLHttpRequest afin d'obtenir des données produit au format JSON à partir du serveur. PHP utilise MySQL pour interroger les données produit de la base de données et les encoder au format JSON. JavaScript analyse les données JSON et les affiche dans le conteneur de pages. Cliquer sur le bouton déclenche une requête Ajax pour charger la liste de produits.

See all articles