在Django中重新加载表数据而无需刷新页面

在我的视图中获取数据的代码如下所示:

order = Order.objects.filter(owner=request.user).order_by('-id')[:10]

我模板中的代码看起来像这样,效果很好。现在,问题是我希望该表每10秒更新一次其信息,而不刷新整个页面。视图的URL为/,模板的名称为home。

           <table class="table table-striped table-condensed">

<tr>

<th>Reg.nr.</th>

<th>M&auml;rke</th>

<th>Modell</th>

</tr>

{% for i in order %}

{% if i.order_booked %}

<tr class="success">

{% else %}

<tr>

{% endif %}

<td>{{ i.regnr|upper }}</td>

<td>{{ i.brand|capfirst }}</td>

<td>{{ i.brand_model|capfirst }}</td>

</tr>

{% endfor %}

</table>

urls.py看起来像这样

urlpatterns = [ url(r'^$',views.home, name='home'), url(r'^login/', auth_views.login, {'template_name':'login.html'}, name='account_login'), url(r'^logout/', auth_views.logout, {'template_name':'logout.html'},name='account_logout'), url(r'^add_order/', views.add_order, name='add_order'), url(r'^admin/', admin.site.urls), ]

你们谁能对此有所了解,我将不胜感激!

回答:

您可以使用setIntervaljQuery AJAX以及view

   <table id="_appendHere" class="table table-striped table-condensed">

<tr>

<th>Reg.nr.</th>

<th>M&auml;rke</th>

<th>Modell</th>

</tr>

{% for i in order %}

{% if i.order_booked %}

<tr class="success">

{% else %}

<tr>

{% endif %}

<td>{{ i.regnr|upper }}</td>

<td>{{ i.brand|capfirst }}</td>

<td>{{ i.brand_model|capfirst }}</td>

</tr>

{% endfor %}

</table>

<script>

var append_increment = 0;

setInterval(function() {

$.ajax({

type: "GET",

url: {% url 'get_more_tables' %}, // URL to your view that serves new info

data: {'append_increment': append_increment}

})

.done(function(response) {

$('#_appendHere').append(response);

append_increment += 10;

});

}, 10000)

</script>

def get_more_tables(request):

increment = int(request.GET['append_increment'])

increment_to = increment + 10

order = Order.objects.filter(owner=request.user).order_by('-id')[increment:increment_to]

return render(request, 'get_more_tables.html', {'order': order})

  {% for i in order %}

<tr>

{% if i.order_booked %}

<tr class="success">

{% else %}

<tr>

{% endif %}

<td>{{ i.regnr|upper }}</td>

<td>{{ i.brand|capfirst }}</td>

<td>{{ i.brand_model|capfirst }}</td>

</tr>

{% endfor %}

然后只需确保将新视图添加到您的视图中urls.py

它的作用是使用setIntervalJS函数,GET每10000毫秒(10秒)向服务器中的视图发出AJAX请求。然后,该视图使用此新上下文呈现一个单独的HTML文件,并将其作为response回发送到原始HTML页面。全新response然后appended通过jQuery您的餐桌。每次发生此循环时,切片都会递增,因此您不会从获得相同的结果Order

请记住,这将不停地循环,因此,如果要结束它,则必须将代码添加到JS以setInterval在最后一个响应返回为空时停止。

以上是 在Django中重新加载表数据而无需刷新页面 的全部内容, 来源链接: utcz.com/qa/410258.html

回到顶部