向 mdl 卡添加 ajax 响应

Question

我想通过 ajax 请求更新内容来做网站。我收到 json 数据，我必须将此 json 数据放入 MDL CARD。 http://www.getmdl.io/components/index.html#cards-section

我的 ajax 代码：

$(document).ready(function(){
    displayRecords(limit, offset);
    $('#button').click(function (){
        limit = limit + 2;
        offset = offset + 2;
        displayRecords(limit, offset);
    });
});
function displayRecords(lim, off){
    $.ajax({
        type: "GET",
        url: "/main/",
        data: {'limit': lim, 'offset': off},
        dataType: 'json',
        success: function(data) {
            for (var post in data){
                $('.mdl-card__supporting-text').append(data[post].fields.title);
            }
        }
    });
}

还有我的 Django 代码：

def posts(request):
    if request.is_ajax():
        offset = request.GET.get('offset')
        limit = request.GET.get('limit')
        all_posts = Post.objects.all()[offset:limit]
        data = serializers.serialize('json', all_posts, ensure_ascii=False)
        print data
        return HttpResponse(data, content_type='application/json; charset=utf8')
    else:
        return render(request, 'main.html')

Answer 1

我使用了 mustache.js。它对我有帮助。