JSON格式的Ajax源数据-无法获取属性'长度'的未定义引用或null引用

Ajax sourced data in JSON format - Unable to get property 'length' of undefined or null reference

本文关键字:引用 null 长度 未定义 属性 获取 Ajax 格式 数据 JSON      更新时间:2023-09-26

我试图将json数据(从Web API ajax调用检索)加载到jQuery DataTables,但我得到了以下错误:

中第38行第314列出现未处理的异常https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js

0x800a138f-JavaScript运行时错误:无法获取属性"length"未定义或空引用

这是我的jQuery调用:

$(document).ready(function () {
    $('#stat').DataTable({
        "responsive": true,
        "paging": false,
        "ordering": false,
        "info": false,
        "bFilter": false,
        "processing": true,
        "serverSide": true,
        "ajax": {
            'url': 'http://localhost:61178/api/financeStats'
        }
    });
});

这是我从Web API调用检索到的JSON数据:

[
    {
        "Description": "Total Sas debt at yesterday",
        "TotAgents": 788,
        "TotAmount": 1767595.5854
    },
    {
        "Description": "Total CL Sas with Rid worked yesterday",
        "TotAgents": 413,
        "TotAmount": 3026100
    },
    {
        "Description": "Total CL Sas with No Rid worked yesterday",
        "TotAgents": 164,
        "TotAmount": 1252650
    },
    {
        "Description": "Total Debt Sas with Rid to be cleared today",
        "TotAgents": 35,
        "TotAmount": 59448.7522
    },
    {
        "Description": "Debt Sas with No Rid to be cleared today",
        "TotAgents": 157,
        "TotAmount": 478285.384
    },
    {
        "Description": "Today Claim opened",
        "TotAgents": 125,
        "TotAmount": 146262.6726
    },
    {
        "Description": "Today Claim still opened",
        "TotAgents": 51,
        "TotAmount": 113485.4991
    },
    {
        "Description": "Today Claim opened & postponed",
        "TotAgents": 18,
        "TotAmount": 27726.748
    },
    {
        "Description": "Today Claim closed by the operators",
        "TotAgents": 8,
        "TotAmount": 4540.1682
    },
    {
        "Description": "Today Claim closed by the system",
        "TotAgents": 47,
        "TotAmount": -4699.3427
    },
    {
        "Description": "Today Claim Locked Sdd",
        "TotAgents": 1,
        "TotAmount": 5209.6
    },
    {
        "Description": "Today Claim Locked No Sdd",
        "TotAgents": 0,
        "TotAmount": 0
    },
    {
        "Description": "Today Claim UnLocked proposal",
        "TotAgents": 0,
        "TotAmount": 0
    },
    {
        "Description": "Overall Claim Locked Sdd",
        "TotAgents": 3,
        "TotAmount": 7196.54
    },
    {
        "Description": "Overall Claim Locked No Sdd",
        "TotAgents": 2,
        "TotAmount": 1714.1
    },
    {
        "Description": "Overall Claim Unlocked proposal",
        "TotAgents": 3,
        "TotAmount": -155.33
    },
    {
        "Description": "Overall Workout",
        "TotAgents": 541,
        "TotAmount": 619838.3527
    }
]

原因

jQuery DataTables的错误Unable to get property 'length' of undefined or null reference(IE)或Cannot read property 'length' of undefined(其他浏览器)通常意味着插件无法访问响应Ajax请求的数据。

你的代码有几个问题

  • 您已经使用serverSide: true启用了服务器端处理模式,但您的数据是为客户端处理模式格式化的。删除serverSide: true以使用客户端处理模式
  • 您的数据是对象数组。在这种情况下,您需要使用columns选项来使用data选项在数据集中为每列定义特性名称
  • 您需要使用dataSrc: ""来匹配JSON数据格式,有关更多信息,请参阅dataSrc

解决方案

使用以下代码:

$('#stat').DataTable({
    "responsive": true,
    "paging": false,
    "ordering": false,
    "info": false,
    "searching": false,
    "ajax": {
        "url": "http://localhost:61178/api/financeStats",
        "dataSrc": ""
    },
    "columns": [
        { "data": "Description" },
        { "data": "TotAgents" },
        { "data": "TotAmount" }
    ]
});

演示

有关代码和演示,请参阅此jsFiddle。