장고 : 템플릿에 아약스 렌더링

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)) 

어떻게 아약스를 통해이 데이터를 동적으로 표시 할 수 있습니까? next_url의 결과를 현재 페이지에 추가하려고합니다 (더 많은 함수를로드하십시오).

Answer 1

다음과 같이하십시오. 클릭하면 [ajax][1]이 제출 될 수 있습니다. 성공하면 div에 HTML을 추가합니다.

$('.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 
     } 
    }); 
});