1

我已经开始了一个新的 Django 项目，试图测试django-datatable-view。

我收到一个 JS 错误，说 Uncaught TypeError: $$.each is not a function。尽管遵循库网站上的代码 jQuery 是在 datatableview.js 之前加载的。

模型.py

from django.db import models
class Post(models.Model):
    title= models.CharField(max_length=150)
    body = models.TextField()
    created = models.DateField()

视图.py

from datatableview.views import DatatableView
from .models import Post
class MyView(DatatableView):
    model = Post
    datatable_options = {
        'columns': [
            'title',
            'body',
            'created',
            ]
    }

网址.py

from django.urls import path
from . import views

urlpatterns = [
    path('', views.MyView.as_view(), name='myview'),
]

post_list.html

{% load static %}
<!-- myapp/mymodel_list.html -->

<!-- Load dependencies -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"
        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
        crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>

<!-- Load js for initializing tables via their server-side options -->
<script type="text/javascript" charset="utf8" src="{% static 'js/datatableview.js' %}"></script>
<script type="text/javascript">
    $(function(){
        datatableview.initialize('.datatable');
    });
</script>

<!-- Render the table skeleton, includes the .datatable class for the on-ready initializer. -->
{{ datatable }}

控制台错误：

  query-3.3.1.min.js:2 jQuery.Deferred exception: $$.each is not a 
   function TypeError: $$.each is not a function
        at Object.initialize 
   (http://127.0.0.1:8000/static/js/datatableview.js:20:12)
        at HTMLDocument.<anonymous> (http://127.0.0.1:8000/:17:23)
        at l (https://code.jquery.com/jquery-3.3.1.min.js:2:29375)
        at c (https://code.jquery.com/jquery-3.3.1.min.js:2:29677) 
    undefined
    w.Deferred.exceptionHook @ jquery-3.3.1.min.js:2
    c @ jquery-3.3.1.min.js:2
    setTimeout (async)
    (anonymous) @ jquery-3.3.1.min.js:2
    u @ jquery-3.3.1.min.js:2
    fireWith @ jquery-3.3.1.min.js:2
    fire @ jquery-3.3.1.min.js:2
    u @ jquery-3.3.1.min.js:2
    fireWith @ jquery-3.3.1.min.js:2
    ready @ jquery-3.3.1.min.js:2
    _ @ jquery-3.3.1.min.js:2
    jquery-3.3.1.min.js:2 Uncaught TypeError: $$.each is not a function
        at Object.initialize (datatableview.js:20)
        at HTMLDocument.<anonymous> ((index):17)
        at l (jquery-3.3.1.min.js:2)
        at c (jquery-3.3.1.min.js:2)

仅呈现表头而不填充数据。关于可能发生的事情的任何想法。正如我所说，这里的大多数答案都提到 jquery 没有被首先加载，但这显然不是上面代码中发生的事情。

4

3 回答 3

2

我有完全相同的问题。所以而不是

<script type="text/javascript">
    $(function(){
        datatableview.initialize('.datatable');
    });
</script>

我们必须初始化数据表：

<script type="text/javascript">
    var opts = {};
    var datatable = datatableview.initialize($('.datatable'), opts);
    var table = datatable.api();
</script>

在你的views.py中，而不是

class MyDatatableView(DatatableView):
    model = Revenue
    columns = ["title", "body", "created"]
    search_fields = ["title", "body"]

您必须这样做（使用 DatatableView 中的模型或 query_set：

class MyDatatable(Datatable):
    class Meta:
        columns = ["title", "body", "created"]
        search_fields = ["title", "body"]


class MyDatatableView(DatatableView):
    model = Revenue
    datatable_class = MyDatatable

但是后来我得到了以下 js essor，知道吗？我正在使用 jQuery 3.3.1 和这个版本的数据表：http: //cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js

Uncaught TypeError: datatable.api is not a function
    at HTMLDocument.<anonymous> (datatable:187)
    at c (jquery.min.js:3)
    at Object.fireWith [as resolveWith] (jquery.min.js:3)
    at Function.ready (jquery.min.js:3)
    at HTMLDocument.H (jquery.min.js:3)

我刚刚找到原因，api调用必须是api而不是api（），因为（）是在datatableview.js中添加的

var table = datatable.api;

我的新问题是搜索，它返回一个 500 服务器错误，它是“FieldError('Related Field got invalid lookup: {}'.format(lookup_name))” 但是即使我添加了我想要搜索的列，如“ title__name”，我仍然在搜索中收到警报，说明：

DataTables 警告：table id=DataTables_Table_0 - Ajax 错误。有关此错误的更多信息，请参阅http://datatables.net/tn/7

于 2019-03-07T15:32:40.450 回答
0

I think the code belongs to 0.8 version and you've updated your package to 0.9. If that's the case you can look at the migration guide here

the 0.9 version has multiple breaking changes. It no longer supports datatable_options in the class instead, things are shifted to Meta class

于 2019-02-18T06:35:46.673 回答
0

除了 openHBP 答案之外，我还必须将初始化放在 document.ready 中：

<script type="text/javascript">                                                    
    $(document).ready(function() {                                                 
        var opts = {};                                                             
        var datatable = datatableview.initialize($('.datatable'), opts);           
        var table = datatable.api;                                                 
    } );                                                                           
</script>
于 2019-04-02T19:28:51.583 回答