title: Ajax not work in Django post
body: <p>I'm trying to use ajax in Django to post comment in a news website.However it doesn't work.<strong>When I click the submit button,it still refreshes the page and make no difference like no ajax.</strong> </p>
  
  <p>I'm really new in Django and Ajax.Any friend can help me solve it?</p>
  
  <p>Here is my view.py:</p>
  
  <pre><code>def newsDetailView(request, news_pk):
      news = News.objects.get(id=news_pk)
      title = news.title
      author = news.author_name
      add_time = news.add_time
      content = news.content
      category = news.category
      tags = news.tag.annotate(news_count=Count('news'))
  
      all_comments = NewsComments.objects.filter(news=news)
  
      comment_form = CommentForm(request.POST or None)
      if request.method == 'POST' and comment_form.is_valid():
          if not request.user.is_authenticated:
              return render(request, 'login.html', {})
          comments = comment_form.cleaned_data.get("comment")
          news_comment = NewsComments(user=request.user, comments=comments, news=news)
          news_comment.save()
  
      return render(request, "news_detail.html", {
          'title': title,
          'author': author,
          'add_time': add_time,
          'content': content,
          'tags': tags,
          'category': category,
          'all_comments': all_comments,
          'comment_form': comment_form
      })
  </code></pre>
  
  <p>Here is my news_detail template where I get form data:</p>
  
  <pre><code>{% if user.is_authenticated %}
  &lt;form id="js-pl-submit" method="POST" action=""&gt;{% csrf_token %}
  {% for field in comment_form %}
  {% for error in field.errors %}
  &lt;div class="alert alert-warning text-center mb-3" role="alert"&gt;{{ error }}&lt;/div&gt;
  {% endfor %}
  {% endfor %}
  </code></pre>
  
  <p><br>
  <br>
  </p>
  
  <p>Here in my news_detail template I render all the comments to the template:   </p>
  
  <pre><code> {% for user_comments in all_comments %}
  &lt;img class="mr-3 comment-avatar rounded-circle"src="{{ MEDIA_URL }}{{ user_comments.user.image }}"alt="Generic placeholder image"&gt;
  &lt;div class="media-body"&gt;
  &lt;h6 class="mt-0 mb-1"&gt;{{ user_comments.user.username }}&lt;/h6&gt;
  {{ user_comments.comments }}
  &lt;/div&gt;
  &lt;span&gt;{{ user_comments.add_time }}&lt;/span&gt;
  {% endfor %}
  </code></pre>
  
  <p>Here is my Ajax in news_detail template:</p>
  
  <pre><code>$('#js-pl-submit').on('click', function(){
      var comments = $("#js-pl-textarea").val()
      if(comments == ""){
          alert("评论不能为空")
          return false
      }
      $.ajax({
          cache: false,
          type: "POST",
          url:"",
          data:{'news_pk':{{ news.id }}, 'comments':comments},
          async: true,
          beforeSend:function(xhr, settings){
              xhr.setRequestHeader("X-CSRFToken", "{{ csrf_token }}");
          },
          success: function(data) {
              if(data.status == 'fail'){
                  if(data.msg == '用户未登录'){
                      window.location.href="login";
                  }else{
                      alert(data.msg)
                  }
              }else if(data.status == 'success'){
                  window.location.reload();//刷新当前页面.
              }
          },
      });
      return false;
  });
  </code></pre>
  
  <p>Finally here is my form.py of the comment.</p>
  
  <pre><code>def words_validator(comment):
      if len(comment) &lt; 4:
          raise ValidationError("亲，最少写两个字")
  
  
  class CommentForm(forms.Form):
      comment = forms.CharField(widget=forms.Textarea(), validators=[words_validator])
  </code></pre>