时间戳

首页 > 解决方案 > 使用 Asp.Net Core 找不到匹配的记录 jquery Datatable？

jquery - 使用 Asp.Net Core 找不到匹配的记录 jquery Datatable？

问题描述

我正在使用 jquery 数据表来显示记录。如果不是服务器端渲染，Datatable 工作正常。我在数据库中有大量记录。我已经实现了分页，但它不起作用。这是代码：

var table = $('#studentDataTable').dataTable({
            serverSide: true,
            "searching": false,
            paging:true,
            ajax: {
                url: '/Student/GetAllStudent/',
                type: 'POST',
                dataSrc: ''
            },
            
            columns: [

                {
                    'data': 'FirstName',
                    
                },
                {
                    'data': 'rollNumber',
                    'searchable': false,

                },
                {
                    'data': 'fatherName',
                    'searchable': false,

                },

                {
                    'data': 'className',
                    'searchable': false,

                },
                {
                    'sortable': false,
                    'searchable': false,
                    
                },


            ]

        });

服务器端操作返回 6 条记录，但数据表始终显示未找到匹配记录。这是服务器响应

{"draw":1,"recordsTotal":100,"recordsFiltered":6,"data":[{"id":1,"userId":"f2992e53-df6a-4eb0-8127-0d2d54de316d","firstName":"Umer","lastName":"Waheed","fatherName":"Abdul","gender":1,"nationality":0,"religionId":0,"email":"yu@gmailcom","birthPlace":0,"dateOfBirth":null,"academicYearId":3,"classSectionId":0,"educationCategoryId":0,"admissionCategoryId":0,"branchId":0,"rollNumber":"4512","username":"Umer_10","className":"Grade 1","classId":3,"sectionName":"C","sectionId":16,"academicYearName":"20-21a","educationCategoryName":"E1","admissionCategoryName":"aa","pageNumber":0,"rowsOfPage":0,"searchByFirstName":null,"searchByLastName":null,"searchByFatherName":null,"searchByClassId":null,"searchBySectionId":null,"classes":null,"sections":null,"academicYears":null,"educationCategories":null,"admissionCategories":null,"classSections":null,"religions":null,"countries":null},{"id":2,"userId":"59cdc2be-aa3e-4c6d-83fc-97e3b0e7200e","firstName":"1","lastName":"1","fatherName":"1","gender":1,"nationality":0,"religionId":0,"email":"1","birthPlace":0,"dateOfBirth":null,"academicYearId":3,"classSectionId":0,"educationCategoryId":0,"admissionCategoryId":0,"branchId":0,"rollNumber":"1","username":"1_25","className":"Grade 1","classId":3,"sectionName":"C","sectionId":16,"academicYearName":"20-21a","educationCategoryName":"E1","admissionCategoryName":"aa","pageNumber":0,"rowsOfPage":0,"searchByFirstName":null,"searchByLastName":null,"searchByFatherName":null,"searchByClassId":null,"searchBySectionId":null,"classes":null,"sections":null,"academicYears":null,"educationCategories":null,"admissionCategories":null,"classSections":null,"religions":null,"countries":null},{"id":3,"userId":"a03a0ec5-6fa6-45f0-897e-ceb2647c8f20","firstName":"2","lastName":"2","fatherName":"21","gender":1,"nationality":0,"religionId":0,"email":"20","birthPlace":0,"dateOfBirth":null,"academicYearId":3,"classSectionId":0,"educationCategoryId":0,"admissionCategoryId":0,"branchId":0,"rollNumber":"562","username":"2_26","className":"Grade 1","classId":3,"sectionName":"C","sectionId":16,"academicYearName":"20-21a","educationCategoryName":"E1","admissionCategoryName":"aa","pageNumber":0,"rowsOfPage":0,"searchByFirstName":null,"searchByLastName":null,"searchByFatherName":null,"searchByClassId":null,"searchBySectionId":null,"classes":null,"sections":null,"academicYears":null,"educationCategories":null,"admissionCategories":null,"classSections":null,"religions":null,"countries":null},{"id":4,"userId":"d0709531-acfb-4c07-96a0-3b59f9f5e9a8","firstName":"sdfas","lastName":"asdf","fatherName":"asdf","gender":1,"nationality":0,"religionId":0,"email":"asdf","birthPlace":0,"dateOfBirth":null,"academicYearId":3,"classSectionId":0,"educationCategoryId":0,"admissionCategoryId":0,"branchId":0,"rollNumber":"sdaf","username":"sdfas_27","className":"Grade 1","classId":3,"sectionName":"D","sectionId":17,"academicYearName":"20-21a","educationCategoryName":"E1","admissionCategoryName":"aa","pageNumber":0,"rowsOfPage":0,"searchByFirstName":null,"searchByLastName":null,"searchByFatherName":null,"searchByClassId":null,"searchBySectionId":null,"classes":null,"sections":null,"academicYears":null,"educationCategories":null,"admissionCategories":null,"classSections":null,"religions":null,"countries":null},{"id":5,"userId":"5d16c8d0-bc72-4a70-8a69-7252e273805c","firstName":"4563","lastName":"1352","fatherName":"iujs","gender":1,"nationality":0,"religionId":0,"email":"umas","birthPlace":0,"dateOfBirth":null,"academicYearId":3,"classSectionId":0,"educationCategoryId":0,"admissionCategoryId":0,"branchId":0,"rollNumber":"sdfa","username":"4563_30","className":"Grade 1","classId":3,"sectionName":"A","sectionId":12,"academicYearName":"20-21a","educationCategoryName":"E1","admissionCategoryName":"aa","pageNumber":0,"rowsOfPage":0,"searchByFirstName":null,"searchByLastName":null,"searchByFatherName":null,"searchByClassId":null,"searchBySectionId":null,"classes":null,"sections":null,"academicYears":null,"educationCategories":null,"admissionCategories":null,"classSections":null,"religions":null,"countries":null},{"id":6,"userId":"b45897e7-7187-4733-b75f-64baff03786c","firstName":"hello","lastName":"ksdjf","fatherName":"hjsjhd","gender":1,"nationality":0,"religionId":0,"email":"sdfasdfasdf","birthPlace":0,"dateOfBirth":null,"academicYearId":3,"classSectionId":0,"educationCategoryId":0,"admissionCategoryId":0,"branchId":0,"rollNumber":"6853","username":"hello_31","className":"Grade 2","classId":4,"sectionName":"A","sectionId":12,"academicYearName":"20-21a","educationCategoryName":"E1","admissionCategoryName":"aa","pageNumber":0,"rowsOfPage":0,"searchByFirstName":null,"searchByLastName":null,"searchByFatherName":null,"searchByClassId":null,"searchBySectionId":null,"classes":null,"sections":null,"academicYears":null,"educationCategories":null,"admissionCategories":null,"classSections":null,"religions":null,"countries":null}]}

上面的代码有什么问题？

标签： jquerydatatables

解决方案

这里有一些注释，应该可以解决我在问题中看到的问题：

  1. 您应该dataSrc: ''从 DataTables 定义中删除。这告诉 DataTables 查看 JSON 的根以显示要显示的数据行。但是，您的数据行位于名为data. 默认情况下，DataTables 期望在一个名为data- 的对象中找到它的数据，因此删除这一行等同于使用dataSrc: 'data'.

  2. 这看起来像一个错字：'data': 'FirstName'. 应该是：'data': 'firstName'。

  3. 这可能是也可能不是问题，但您的 final 字段没有声明data来源。它只包含sortable和searchable。也许您在问题中未显示的某处提供数据值 - 否则，您需要提供一个data值。

  4. 一个小点：您应该删除所有不需要的额外逗号。例如：'data': 'FirstName',。也许您只显示了表定义的一个子集——在这种情况下，这些逗号确实需要存在。但通常它们应该被删除。它们可能不会在这里造成问题 - 但在某些地方，这些额外的逗号会导致语法错误。

以上所有点将导致以下结果：

var table = $('#studentDataTable').dataTable({
    serverSide: true,
    "searching": false,
    paging:true,
    ajax: {
        url: '/Student/GetAllStudent/',
        type: 'POST'
    },
    columns: [
        {
            'data': 'FirstName'
        },
        {
            'data': 'rollNumber',
            'searchable': false
        },
        {
            'data': 'fatherName',
            'searchable': false
        },
        {
            'data': 'className',
            'searchable': false
        },
        {
            'data': '<aValidFieldNameNeededInHere>',
            'sortable': false,
            'searchable': false,        
        }
    ]

});

如果您在进行这些更改后仍有问题，请查看浏览器控制台（通常是浏览器中的 F12）。任何错误消息都会显示在那里。

推荐阅读