CSS

Question

我尝试使用jQuery DataTables，但是我收到了错误

TypeError：c未定义

我不知道我的代码有什么问题，因为我可以看到JSON正确检索并且格式正确但我不知道它有什么问题我得到了上述错误

我的JSON：

{"Data":[{"LOGIN":10184},{"LOGIN":10214},{"LOGIN":10180},{"LOGIN":10187},{"LOGIN":10179},{"LOGIN":10280},{"LOGIN":201},{"LOGIN":10238},{"LOGIN":10296},{"LOGIN":10312}]}

和我的DataTables代码：

$(document).ready(function() {
    $('#tablename').dataTable( {
        "processing": true,
        "serverSide": true,
        "ajax": {
            "type": "POST",
        "url": "https://test.com/api/db/select",
        "data": function ( json ) {  return JSON.stringify( { "Sql": 12 } );},
        "contentType": "application/json; charset=utf-8",
        "dataType": "json",
        "processData": true,
            beforeSend : function(xhr){
                        var access_token = sessionStorage.getItem('access_token');
                        xhr.setRequestHeader('Authorization', 'Bearer ' + access_token);
            }
        },
        "dataSrc": "Data",
        "columns": [
            { "data": "LOGIN" }
        ]
    } );
} );

Answer 1

检查您是否添加了

<thead></thead>

<tbody></tbody>

我已经通过添加这些问题解决了这个问题。

所以基本上结构必须像：

<table>
 <thead>
  <tr>
   <th></th>
   <th></th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td></td>
   <td></td>
  </tr>
 </tbody>
</table>

Answer 2

有时，此类型问题通过使用HTML和数据表列修复不匹配/不相等的列来实现。

"columns": [
        null,
        null,
        null,
        {"orderable": false, "width":"2%"},
    ],

以上javascript定义了4列，HTML有5列

<tr>
   <td>A</td>
   <td>B</td>
   <td>C</td>
   <td>D</td>
   <td>E</td>
</tr>

因此，您必须修复/等于HTMl和Datatable配置。

"columns": [
        null,
        null,
        null,
        null, //Added New
        {"orderable": false, "width":"2%"},
    ],

Answer 3

dataSrc是一个特殊的dataTables ajax选项，应该包含在ajax对象中：

"ajax": {
    "dataSrc": "Data", //<--- place dataSrc here instead
    "type": "POST",
    ...
}

你把它放在ajax之外，并且数据表不知道使用什么来源（除了盲目地尝试ajax响应）或LOGIN所属的地方。

Answer 4

在我的情况下，我不得不从thead内部删除colspan属性并摆脱错误;（

Answer 5

在我的情况下，我得到了同样的错误，因为我使用了 ajax.dataSrc（data）函数来操作数据。但在那之后我忘了返回数据。

"dataSrc": function ( json ) {
  for ( var i=0, ien=json.data.length ; i<ien ; i++ ) {
      //somethings...
  }
  return json.data;// I forgot this line, then i got the error "TypeError: c is undefined"
}

几分钟后，我检查了ajax.dataSrc函数的文档，我注意到我没有返回：

返回：数组 。 DataTables用于绘制表的数据数组

我希望你没有同样的分心......

Answer 6

在我的情况下， th 和 td ，由于colspan导致计数不相等，删除了colspan即可。

Answer 7

在我的情况下，服务器端缺少aaData返回结果。

//Javascript
$('#table').DataTable({
        sAjaxSource: '/load',
        aoColumns: [
         ...
        ],
});
//server side(in Rails)
render json: {'aaData'=>data}

Answer 8

在我的情况下，我的前端ajax: { dataSrc: "data" }还可以，但是在服务器端，我返回了第一个字母为大写return Json(new { Data = model });的对象

Answer 9

前一天，另一种解决方案-这次由样式表引起！

在花了数小时将庞大的网页简化为原始图表代码后，我发现，当样式表中字体的CSS规则包含calc函数时，会显示此错误（对于饼图）。

在我们的样式表中，以下代码行：

html {
  font-size: calc(12px + 5%);
}

...打破图表。我们之所以需要这样做，是因为我们的Web字体无法顺利调整大小，并且需要稍大于12像素但小于13像素的大小，并且这种技巧迫使更好地调整大小。

在图表小部件上覆盖样式规则直接解决了该问题：

CSS

html {
  font-size: calc(12px + 5%);
}
.widget {
   font-size: 12px /* Replace the above rule */;
}

JS

var GoogleChart1 = new google.visualization.PieChart(document.getElementById('Chart1'));

HTML

<div id="Chart1" class="widget"></div>

Answer 10

检查以下内容

<td></td> -- 检查计数

<th></th> -- 检查计数

检查 <tbody> 和 <thead> - 打开和关闭

数据表TypeError：c未定义

10 个答案:

CSS

JS

HTML