views.py

Question

需要使用新数据每10秒更新一次小表。整个网站都在Django。 JSON将数据解析为1个表，并在数据库中每10秒重写一次数据。该网站显示数据库中的数据。我需要的程序是每隔10秒用新数据刷新前端表 - 这是我假设的AJAX，你能帮我写代码吗？它不会将数据附加到表中，只需继续刷新即可。

示例 - 数据库中的表已修复了10行数据，JSON正在刷新它。前端总是会显示10行，所以每隔10秒，表（前端）总会显示10行和新数据。

Django版本1.11

以下是python文件

views.py

def prices(request):
    prices = Price.objects.all().order_by('id')
    return render(request, 'prices.html', {'prices':prices})

prices.html

<div class="col-md-8">
     <table class="table table-striped">
         <thead>
             <tr>
                 <th>TYPE</th>
                 <th>NAME</th>
                 <th>PRODUCT</th>
                 <th>VALUE</th>                 
             </tr>
         </thead>
         <tbody>
         {% for price in prices %}
             <tr>
                 <td>{{ price.type }}</td>
                 <td>{{ price.name }}</td>
                 <td>{{ price.product }}</td>
                 <td>{{ price.value }}</td>
             </tr>
         {% endfor %}
         </tbody>
     </table>
 </div>

urls.py

urlpatterns = [
     url(r'^prices/', product_views.prices, name='prices'),
     url(r'^admin/', admin.site.urls),
]

Answer 1

我已经使用Django REST Framework和AJAX完成了上述提示。不知道如何在视图中这样做，所以我使用REST。通过使用REST，我有JSON用于AJAX。上一个答案是刷新整个页面，这个是在前端刷新表。

我不能说这是否是最佳解决方案，但它的效果非常好。也许有一个更快的。

API

serializers.py

from rest_framework import serializers
from .models import Price

class PriceModelSerializer(serializers.ModelSerializer):
     class Meta:
         model = Price
         fields = [
             'type',
             'name',
             'product',
             'value',
         ]

用于API的views.py

 from rest_framework import generics
 from .serializers import PriceModelSerializer
 from .models import Price

 class PriceListAPIView(generics.ListAPIView):
      serializer_class = PriceModelSerializer

     def get_queryset(self):
          return Price.objects.all().order_by('sort')

urls.py for API

 urlpatterns = [
     #...other urls
     url(r'^$', PriceListAPIView.as_view(), name='list'),
 ]

模板

 <section class="pt100 pb100">
     <div class="container">
          <div class="vertical-align">
              <div class="col-md-12">
                  <table class="table table-striped">
                       <thead>
                            <tr>
                                 <th>TYPE</th>
                                 <th>NAME</th>
                                 <th>PRODUCT</th>
                                 <th>VALUE</th>
                            </tr>
                       </thead>
                       <tbody>

                       </tbody>
                  </table>
              </div>
          </div>
      </div>
 </section>

main urls.py

 urlpatterns = [
     #...other urls
     url(r'^api/prices/', include('[LOCATION_OF_YOUR_URLS].urls', namespace='api-prices')),
 ]

AJAX

 <script>

    setInterval(function() {
        $.ajax({
            method: "GET",
            url: "/api/prices/",
            success: function(data) {
                $("tbody").empty();
                $.each(data, function (key, value) {
                    var priceKey = key;
                    var priceType = value.type;
                    var priceName = value.name;
                    var priceProduct = value.product;
                    var priceValue = value.value;
                    $("tbody").append(
                       "<tr><td>" + priceType + "</td><td>" + priceName + "</td><td>" + priceProduct + "</td><td>" + priceValue + "</td></tr>"
                    )
                })
            },
            error: function(data) {
                console.log("error")
                console.log(data)
            }
        })
    }, 1000)
 </script>

Answer 2

创建一个django视图，返回指定表中的所有行。现在创建一个ajax函数，每隔10秒轮询一次django视图（通过url）。

使用jquery，你必须像这样包含jquery cdn：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js">

现在是ajax function（jquery ajax）

var updateTable = $.ajax({

                method: "GET",
                url: "prices/",


                success: function(data, textStatus, request) {

                console.log(data) 
                //update your DOM with new data recieved in **data**

            }
        });

setInterval(updateTable,10000);

每10秒执行一次这个ajax函数。请记住，视图将返回带有表的原始html。您编写的ajax函数的成功回调函数可以访问此数据。现在，您必须使用 data 变量中的新表更新DOM。尝试从成功回调内部运行console.log（data）以查看服务器的响应。

重新加载表而不刷新Django中的页面

views.py

prices.html

urls.py

2 个答案: