2016-09-27 73 views
3

我有一个视图,它将查询集中的分页对象(发送到查询集)发送到模板,我将模板作为表格进一步呈现。我想要做的是点击模板上的分页栏上的页码,它应该进行ajax调用,以获得该页码的分页输出,并动态更新表的内容。如何在AJAX调用中重新呈现Django模板代码

查看:

def accounts(request): 
    #Including only necessary part 
    accounts_list = Accounts.objects.all() 
    paginator = Paginator(accounts_list, 25) 
    page = request.GET.get('page') 
    try: 
     accounts = paginator.page(page) 
    except PageNotAnInteger: 
     # If page is not an integer, deliver first page. 
     accounts = paginator.page(1) 
    except EmptyPage: 
     # If page is out of range, deliver last page of results. 
     accounts = paginator.page(paginator.num_pages) 

    context['accounts'] = accounts 
    return render(request, template, context) 

模板加载此为:

{% if accounts %} 
<table id="acc"> 
    <tr> 
     <th>Field 1</th> 
     ... 
     <th>Field N</th> 
    </tr> 
    {% for item in accounts %} 
    <tr> 
     <td>{{ item.field1 }}</td> 
     ...<!-- Some complex logic with template tags too in here --> 
     <td>{{ item.fieldN }}</td> 
    </tr> 
    {% endfor %} 
</table> 
{% endif %} 

现在对于分页栏,我使用Bootpag's library,我可以渲染的东西为:

$('.pagination_top').bootpag({ 
    /*bootpag logic here */ 
}).on("page", function(event, num){ 
    //$.ajax loading here where I can update the table div with new output 
    //or make the table div "template code" reload without reloading page 
} 

对不起,我有没有显示我在ajax部分尝试过的东西,因为我完全空白了如何让模板重新呈现无需重新加载页面而返回的新帐户。

我能想到的唯一肮脏的解决方案是在视图中生成我的整个html,然后用新的html ajax返回更新表格div的html?

什么是简单的方法来说,重新加载表格div使用模板渲染逻辑写入没有重新加载页面?这可以通过将表格部分作为单独的模板并包含/扩展模板来实现?

请注意,我不能使用一种方法获取模板上的所有数据,然后使用一些jquery/js libaray的分页逻辑,因为完整的数据是相当大的。

回答

3

我解决的问题如下:

分居表部分为模板table.html为:

应用程序/表。HTML:

{% if accounts %} 
<table id="acc"> 
    <tr> 
     <th>Field 1</th> 
     ... 
     <th>Field N</th> 
    </tr> 
    {% for item in accounts %} 
    <tr> 
     <td>{{ item.field1 }}</td> 
     ...<!-- Some complex logic with template tags too in here --> 
     <td>{{ item.fieldN }}</td> 
    </tr> 
    {% endfor %} 
</table> 
{% endif %} 

初级模板作为main.html中包含模板调用此:

应用程序/ main.html中:

<div class="table-responsive"> 
    {% include 'app/table.html' %} 
</div> 

现在,在我看来,我加入这使得只有一条线table.html如果请求是ajax请求。

if request.is_ajax(): 
     return render(request, 'app/table.html', context) 
#else 
return render(request, 'app/main.html', context) 

重装表上的分页为:

$('.pagination_top').bootpag({ 
    /*bootpag logic here */ 
}).on("page", function(event, num){ 
    $(".table-responsive").html('').load(
     "{% url 'app:accounts' %}?page=" + num 
    ); 
}); 
+0

你的js脚本仍在重新加载页面,页面url是否随着每次点击而改变? – sgauri

1

如果你想依赖django模板,你应该重新加载页面并发送请求中的分页信息。这是通常做的事情(例如在django-admin中)。它需要重新加载页面,但这是django模板的作用。

否则,我会委托整个渲染到客户端,并提供只有在Django的JSON视图。这样,django将提供一个模板,其中包含一些标记以及您最喜欢的js库,该模板负责完成AJAX调用并直接渲染数据。

UPDATE:

如果你真的需要做到这一点,你所提到的方法是可行的。没有什么能阻止你渲染你的模板的一部分,外包在单独的文件中并将已经呈现的HTML发送给你的客户端。

因此,您可以利用include template tag将表格模板移动到单独的文件中。 对于AJAX调用,您应该使用第二个视图,它只呈现模板的表格部分。

所有这些对我来说都是一种诡计,但它应该起作用。

+0

有没有办法使AJAX返回,在这种情况下Django的templatetags数据? 因为我的逻辑很多取决于这些模板标签 – MohitC

+0

我已经更新了关于您的评论的答案 – dahrens

+0

如果我必须在视图本身中生成整个html,那么分隔模板的需要是什么? – MohitC

相关问题