title: Failing to display json into html with ajax
body: <p>I am implementing a 'load more' button for my posts.</p>
  <p>With ajax this is what I'm doing to display the loaded posts into my html:</p>
  <pre><code>success:function(res){
                  var _html='';
                  var json_data=$.parseJSON(res.posts);
                  $.each(json_data,function(index,data){
                  _html+='&lt;div class=&quot;post-box col-md-1&quot;&gt;\
                    &lt;div class=&quot;info-box mb-4&quot;&gt;\
                    &lt;div&gt;\
                      {% if '+data.fields.cantidad+' == 1 %}\
                        &lt;h3&gt;'+data.fields.donador+'&lt;/h3&gt;&lt;text&gt;te donó '+data.fields.cantidad+' '+data.fields.objeto+'.&lt;/text&gt;\
                      {% else %}\
                      &lt;h3&gt;'+data.fields.donador+' &lt;/h3&gt;&lt;text&gt;te donó '+data.fields.cantidad+' '+data.fields.objeto+'s.&lt;/text&gt;\
                      {% endif %}\
                        &lt;br&gt;\
                        &lt;text&gt;'+data.fields.whenpublished+' &lt;/text&gt;\
                        {% if '+data.fields.message+' != &quot;&quot; %}\
                        &lt;hr&gt;\
                      &lt;text&gt;'+data.fields.message+'&lt;/text&gt;\
                      {% endif %}\
                    &lt;/div&gt;\
                    &lt;/div&gt;\
                &lt;/div&gt;';
                                };
  </code></pre>
  <p>This is my model:</p>
  <pre><code>class Donacion(models.Model):
      creador_d = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
      creation_date = models.DateTimeField(auto_now_add=True, blank=True)
      message = models.CharField(max_length=300, null=True, blank=True)
      donador = models.CharField(max_length=30, null=True, blank=True)
      cantidad = models.IntegerField()
      objeto = models.CharField(max_length=30, null=True, blank=True)
  
      def whenpublished(self):
          now = timezone.now()
          
          diff = now - self.creation_date
  
          if diff.days == 0 and diff.seconds &gt;= 0 and diff.seconds &lt; 60:
              seconds= diff.seconds
              
              if seconds == 1:
                  return &quot;Hace &quot; + str(seconds) +  &quot; segundo&quot;
              
              else:
                  return &quot;Hace &quot; + str(seconds) +  &quot; segundos&quot;
  
              
  
          if diff.days == 0 and diff.seconds &gt;= 60 and diff.seconds &lt; 3600:
              minutes= math.floor(diff.seconds/60)
  
              if minutes == 1:
                  return &quot;Hace &quot; + str(minutes) +  &quot; segundo&quot;
              
              else:
                  return &quot;Hace &quot; + str(minutes) +  &quot; minutos&quot;
  
  
  
          if diff.days == 0 and diff.seconds &gt;= 3600 and diff.seconds &lt; 86400:
              hours= math.floor(diff.seconds/3600)
  
              if hours == 1:
                  return &quot;Hace &quot; + str(hours) +  &quot; hora&quot;
  
              else:
                  return &quot;Hace &quot; + str(hours) +  &quot; horas&quot;
  
        
  </code></pre>
  <p>There are some problems here.</p>
  <ol>
  <li><code>'+data.fields.whenpublished+'</code>: This value returns <code>undefined</code> and I don't know how to access it</li>
  <li>This condition: <code>{% if '+data.fields.cantidad+' == 1 %}</code> it is intepreted as False, while <code>'+data.fields.cantidad+'</code> is actually one <code>1</code></li>
  <li>This condition: <code>{% if donacion.message != '' %}</code> it is intepreted as True even if <code>'+data.fields.message+'</code> == <code>''</code> And in that case it should be interpreted as False</li>
  </ol>
  <p>In order for you to compare this ajax html I'll provide you with the one I usually use to render my posts via a <code>GET</code> method:</p>
  <pre><code>     &lt;div class=&quot;post-box col-md-1&quot;&gt;
            &lt;div&gt;
                &lt;div&gt;
                      {% if donacion.cantidad == 1 %}
                        &lt;h3&gt;{{donacion.donador}} &lt;/h3&gt;&lt;text&gt;te donó {{donacion.cantidad}} {{donacion.objeto}}.&lt;/text&gt;
                      {% else %}
                      &lt;h3&gt;{{donacion.donador}} &lt;/h3&gt;&lt;text&gt;te donó {{donacion.cantidad}} {{donacion.objeto}}s.&lt;/text&gt;
                      {% endif %}
                        &lt;br&gt;
                        &lt;text&gt;{{ donacion.whenpublished }}&lt;/text&gt;
                        {% if donacion.message != '' %}
                        &lt;hr&gt;
                      &lt;text&gt;{{donacion.message}}&lt;/text&gt;
                      {% endif %}
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
  </code></pre>
  <p>views.py</p>
  <pre><code>def load_more(request):
      offset=int(request.POST['offset'])
      limit=2
      posts=Post.objects.all()[offset:limit+offset]
      totalData=Post.objects.count()
      data={}
      posts_json=serializers.serialize('json',posts)
      return JsonResponse(data={
          'posts':posts_json,
          'totalResult':totalData
      })
  </code></pre>