问题:Django中的数据表服务器端处理

如何解决问题:Django中的数据表服务器端处理

我对Django完全陌生。我正在尝试实现数据表服务器端处理。我已经在我的models.py,views.py和urls.py中编写了一些代码,并且还遵循了Datatables的官方文档。但不幸的是,我的终端出现错误,无法弄清楚如何解决。

这里是, models.py

from django.db import models


class Products(models.Model):
    title = models.CharField(max_length=100,blank=True)
    description = models.TextField(blank=True)
    price = models.IntegerField(blank=True,null=True)

    def __str__(self):
        return self.title

views.py

from django.shortcuts import render
from ajax_crud.models import Products
from django.http import  JsonResponse

def product_json(request):
    products_json = Products.objects.all().values('title','description','price')
    data = list(products_json)
    value = JsonResponse(data,safe=False)
    print(value)
    return value

urls.py

from django.urls import path
from ajax_crud.views import product_json

urlpatterns = [
   
    path('json/',product_json,name='json'),]

demo-datatbles.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="//cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
    </head>
    <body>
        <h1>List of Products</h1>
        <hr>
        <table id="demo-table">
            <thead>
                <tr>
                    <th>title</th>
                    <th>description</th>
                    <th>price</th>

                </tr>
            </thead>
            <tbody></tbody>
        </table>

        <script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
        <script src="//cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

        <script>
$(document).ready(function() {
    $('#demo-table').DataTable( {
        "processing":true,"serverSide": true,"ajax": {
            "type" : "GET","url": "{% url 'json' %}","dataSrc": "objects"
        },"columns": [
            { "data": "title" },{ "data": "description" },{ "data": "price" },]
    } );
} );
</script>
    </body>
</html>

我在终端中的错误。

[03/Sep/2020 05:31:49] "GET /json/?draw=1&columns%5B0%5D%5Bdata%5D=title&columns%5B0%5D%5Bname%5D=&columns%5B0%5D%5Bsearchable%5D=true&columns%5B0%5D%5Borderable%5D=true&columns%5B0%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B0%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B1%5D%5Bdata%5D=description&columns%5B1%5D%5Bname%5D=&columns%5B1%5D%5Bsearchable%5D=true&columns%5B1%5D%5Borderable%5D=true&columns%5B1%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B1%5D%5Bsearch%5D%5Bregex%5D=false&columns%5B2%5D%5Bdata%5D=price&columns%5B2%5D%5Bname%5D=&columns%5B2%5D%5Bsearchable%5D=true&columns%5B2%5D%5Borderable%5D=true&columns%5B2%5D%5Bsearch%5D%5Bvalue%5D=&columns%5B2%5D%5Bsearch%5D%5Bregex%5D=false&order%5B0%5D%5Bcolumn%5D=0&order%5B0%5D%5Bdir%5D=asc&start=0&length=10&search%5Bvalue%5D=&search%5Bregex%5D=false&_=1599111109862 HTTP/1.1" 200 97

请有人帮我摆脱它。 我们将非常感谢您的帮助。

解决方法

我建议分两个步骤进行操作:

  1. 显示基本数据(就像您未使用服务器端处理一样)。

  2. 添加特定的服务器端逻辑。

背景

我假定您的应用程序正在正确处理HTML模板,并在此表达式中构建有效的URL:{% url 'json' %}

我还将假设从ajax请求发送到HTML页面的响应完全如下(即,您提供的确切JSON数据):

[{
    "id": 1,"title": "Neutrogena Oil-Free Acne Wash,177ML","description": "Nice products","price": 300
},{
    "id": 2,"title": "Product one hello2","description": "Notes","price": 400
}]

如果这些假设中的任何一个都不成立,则以下内容可能无济于事。

(您可以使用浏览器的控制台来检查网页中是否接收到JSON数据响应。F12打开浏览器控制台并检查“网络”标签。)

第1步

在此步骤中,我们将继续使用"serverSide": true-因此,请不要将其删除。

您的数据表定义包含以下行:

"dataSrc": "objects"

这意味着DataTables将在JSON中查找使用该名称的对象。但是没有名为objects的对象-因此找不到数据。

因此,您需要从模板中删除该行

但是因为您使用的是"serverSide": true,所以还需要进行更多更改。

查看我在评论中提到的链接(this one)。这描述了您在响应ajax请求时需要从服务器传递到DataTables的JSON数据。同一页面(here)上也有一个示例。

因此,我们可以获取您的JSON并使其符合该要求:

{
    "draw": 1,"recordsTotal": 1000,"recordsFiltered": 1000,"data": [{
        "id": 1,"price": 300
    },{
        "id": 2,"price": 400
    }]
}

根据服务器端处理的要求,我们已将您的数据包装在一些其他数据中。您的数据现在位于名为data的对象中-DataTables希望在该对象中找到它,以填充表中的行。因此,我们不需要在这里使用"dataSrc": "data"-因为data是默认(预期)值。

在上面的示例中,我使用了110001000的值-仅用于测试。您可以使用这些值-然后我们将在下面的步骤2中对其进行修复。

因此,您需要更改Django逻辑,以便它构建上述JSON ,并将其返回到DataTables。

第2步

通常(当您不使用服务器端处理时),服务器会立即将其所有数据发送到DataTables。 DataTables处理分页,过滤和排序的所有逻辑。

但是现在,通过服务器端处理,您的Django代码将负责所有这些工作。它不会发送所有数据-一次只会发送一个小子集。这是服务器端处理的强大功能:您不会将所有1,000,000条记录发送到浏览器(这会使它崩溃)。对于每个请求,您只发送一个小的快速子集。

为此,Django需要从DataTables中读取请求。每当用户移至新页面,执行排序操作或过滤数据时,DataTable都会自动发送请求。

这是一个这样的请求-您在问题中提供的请求:

draw=1
&columns[0][data]=title
&columns[0][name]=
&columns[0][searchable]=true
&columns[0][orderable]=true
&columns[0][search][value]=
&columns[0][search][regex]=false
&columns[1][data]=description
&columns[1][name]=
&columns[1][searchable]=true
&columns[1][orderable]=true
&columns[1][search][value]=
&columns[1][search][regex]=false
&columns[2][data]=price
&columns[2][name]=
&columns[2][searchable]=true
&columns[2][orderable]=true
&columns[2][search][value]=
&columns[2][search][regex]=false
&order[0][column]=0
&order[0][dir]=asc
&start=0
&length=10
&search[value]=
&search[regex]=false

我手动URL-decoded请求,以使其更易于阅读。

此请求包含Django为了构建所需响应所需的所有信息。

例如:

start=0
length=10

这告诉您需要在响应中提供10条记录-这些将是前10条记录(第1页的索引为0)。

这:

order[0][dir]=asc

这告诉您数据需要按升序按列0(第一列-title)进行排序。

有关详细信息,请参见here

因此,您需要在Django应用程序中编写所有这些逻辑-读取请求,然后实施其中包含的指令,以建立正确的响应。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


使用本地python环境可以成功执行 import pandas as pd import matplotlib.pyplot as plt # 设置字体 plt.rcParams[&#39;font.sans-serif&#39;] = [&#39;SimHei&#39;] # 能正确显示负号 p
错误1:Request method ‘DELETE‘ not supported 错误还原:controller层有一个接口,访问该接口时报错:Request method ‘DELETE‘ not supported 错误原因:没有接收到前端传入的参数,修改为如下 参考 错误2:cannot r
错误1:启动docker镜像时报错:Error response from daemon: driver failed programming external connectivity on endpoint quirky_allen 解决方法:重启docker -&gt; systemctl r
错误1:private field ‘xxx‘ is never assigned 按Altʾnter快捷键,选择第2项 参考:https://blog.csdn.net/shi_hong_fei_hei/article/details/88814070 错误2:启动时报错,不能找到主启动类 #
报错如下,通过源不能下载,最后警告pip需升级版本 Requirement already satisfied: pip in c:\users\ychen\appdata\local\programs\python\python310\lib\site-packages (22.0.4) Coll
错误1:maven打包报错 错误还原:使用maven打包项目时报错如下 [ERROR] Failed to execute goal org.apache.maven.plugins:maven-resources-plugin:3.2.0:resources (default-resources)
错误1:服务调用时报错 服务消费者模块assess通过openFeign调用服务提供者模块hires 如下为服务提供者模块hires的控制层接口 @RestController @RequestMapping(&quot;/hires&quot;) public class FeignControl
错误1:运行项目后报如下错误 解决方案 报错2:Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.8.1:compile (default-compile) on project sb 解决方案:在pom.
参考 错误原因 过滤器或拦截器在生效时,redisTemplate还没有注入 解决方案:在注入容器时就生效 @Component //项目运行时就注入Spring容器 public class RedisBean { @Resource private RedisTemplate&lt;String
使用vite构建项目报错 C:\Users\ychen\work&gt;npm init @vitejs/app @vitejs/create-app is deprecated, use npm init vite instead C:\Users\ychen\AppData\Local\npm-
参考1 参考2 解决方案 # 点击安装源 协议选择 http:// 路径填写 mirrors.aliyun.com/centos/8.3.2011/BaseOS/x86_64/os URL类型 软件库URL 其他路径 # 版本 7 mirrors.aliyun.com/centos/7/os/x86
报错1 [root@slave1 data_mocker]# kafka-console-consumer.sh --bootstrap-server slave1:9092 --topic topic_db [2023-12-19 18:31:12,770] WARN [Consumer clie
错误1 # 重写数据 hive (edu)&gt; insert overwrite table dwd_trade_cart_add_inc &gt; select data.id, &gt; data.user_id, &gt; data.course_id, &gt; date_format(
错误1 hive (edu)&gt; insert into huanhuan values(1,&#39;haoge&#39;); Query ID = root_20240110071417_fe1517ad-3607-41f4-bdcf-d00b98ac443e Total jobs = 1
报错1:执行到如下就不执行了,没有显示Successfully registered new MBean. [root@slave1 bin]# /usr/local/software/flume-1.9.0/bin/flume-ng agent -n a1 -c /usr/local/softwa
虚拟及没有启动任何服务器查看jps会显示jps,如果没有显示任何东西 [root@slave2 ~]# jps 9647 Jps 解决方案 # 进入/tmp查看 [root@slave1 dfs]# cd /tmp [root@slave1 tmp]# ll 总用量 48 drwxr-xr-x. 2
报错1 hive&gt; show databases; OK Failed with exception java.io.IOException:java.lang.RuntimeException: Error in configuring object Time taken: 0.474 se
报错1 [root@localhost ~]# vim -bash: vim: 未找到命令 安装vim yum -y install vim* # 查看是否安装成功 [root@hadoop01 hadoop]# rpm -qa |grep vim vim-X11-7.4.629-8.el7_9.x
修改hadoop配置 vi /usr/local/software/hadoop-2.9.2/etc/hadoop/yarn-site.xml # 添加如下 &lt;configuration&gt; &lt;property&gt; &lt;name&gt;yarn.nodemanager.res