Django的：AJAX渲染到模板

Question

我的模板：

{% block content %} 
    {% if next_url %} 
     <ul class="pager"> 
      <li><a href="{{ next_url}}">Next</a></li> 
     </ul> 
    {% endif %} 
    {% if photos %} 
     {% for photo in photos %} 
      <div class="span3" > 
       <p> 
        <a href="http://instagram.com/{{ photo.user.username }}"><img src="{{ photo.user.profile_picture }}" width="35" height="35"></a> <a href="http://instagram.com/{{ photo.user.username }}">{{ photo.user.username }}</a> 
        <span class="info_down">[ <a href="{{ photo.images.thumbnail.url }}">T</a> | <a href="{{ photo.images.standard_resolution.url }}">M</a> | <a href="{{ photo.images.low_resolution.url }}">L</a> | <a href="{{ photo.link }}">O</a> ]</span> 
       </p> 
       <p> 
        <img src="{{ photo.images.low_resolution.url }}"> 
       </p> 
       <p> 
        <i class="icon-heart"></i> {{ photo.l }} 
       </p> 
       <p> 
        <i class="icon-time"></i> {{ photo.created_time }} <a style="float:right;" href="http://maps.google.com.ua/maps?q={{ photo.location.point.latitude }}+{{ photo.location.point.longitude }}"><i class="icon-map-marker"></i> Map</a> 
       </p> 
      </div> 

     {% endfor %} 
    {% else%} 
     <p>empty ;(</p> 
    {% endif %} 
{% endblock %} 

{% block pagination %} 
    {% if next_url %} 
     <div class="span12" > 
      <ul class="pager"> 
       <li> 
        <a href="{{ next_url}}">Next</a> 
       </li> 
      </ul> 
     </div> 
    {% endif %} 
{% endblock %} 

而一個有一個觀點，即獲得 '照片'，並通過外部API 'next_url'，使一些變化：

def tag(request, tag): 
    api = InstagramAPI(client_id='', client_secret='') 
    tag_m, next = api.tag_recent_media(tag_name=tag.encode('utf-8'), count=16) 
    photos = photos + tag_m 

    if next != None: 
     .... 
     next_url = .... 

    .... 
    for photo in photos: 
    .... 

    return render_to_response(
     'tag.html', 
     {'photos': photos, 'next_url': next_url}, 
     context_instance=RequestContext(request)) 

如何我可以通過ajax動態顯示這些數據嗎？我想將next_url的結果追加到當前頁面（加載更多功能）。

Answer 1

這就是你會做的：點擊，你可以觸發[ajax][1]提交。成功時，您會獲得HTML，您將其添加到div。

$('.span12 .pager li a').click(function(){ 
    var href = $(this).attr('href'); 
    $.ajax({ 
     url: href, 
     success: function(data, status, xhr){ 
      // append the response data in the HTML 
     } 
    }); 
});