Weird jQuery DataTables Инициализация Поведение

У меня есть следующий код. И мне интересно, почему это работает в одном направлении, но не в другом.Weird jQuery DataTables Инициализация Поведение

<!doctype html> 
<html> 
<head> 
<meta charset="UTF-8"/> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"/> 
<meta name="viewport" content="width=device-width, initial-scale=1"/> 
<title>Chart</title> 
<link href="./css/jquery.dataTables.min.css" rel="stylesheet"/> 
<script src="./js/jquery-3.1.0.min.js"></script> 
<script src="./js/jquery.dataTables.min.js"></script> 
<script> 
/* 
// THIS BLOCK DOES NOT WORK 
var tbldata; 

$(document).ready 
(
     function() 
     { 
       tbldata = $("#tbldata").DataTable(); 
     } 
); 
*/ 

// THIS SINGLE LINE WORKS 
var tbldata = $("#tbldata").DataTable(); 
</script> 
</head> 
<body> 
     <div> 
       <table id="tbldata"> 
         <thead></thead> 
         <tbody></tbody> 
       </table> 
     </div> 
</body> 
</html>

Это дает мне следующую ошибку, если я раскомментировать блок, который я помеченный как не работаю и закомментировать одну строку, которая работает.

jQuery.Deferred exception: Cannot read property 'aDataSort' of undefined TypeError: Cannot read property 'aDataSort' of undefined 
    at V (http://192.168.33.10:5000/static/js/jquery.dataTables.min.js:65:443) 
    at va (http://192.168.33.10:5000/static/js/jquery.dataTables.min.js:70:61) 
    at HTMLTableElement.<anonymous> (http://192.168.33.10:5000/static/js/jquery.dataTables.min.js:91:148) 
    at Function.each (http://192.168.33.10:5000/static/js/jquery-3.1.0.min.js:2:2815) 
    at r.each (http://192.168.33.10:5000/static/js/jquery-3.1.0.min.js:2:1003) 
    at r.m [as dataTable] (http://192.168.33.10:5000/static/js/jquery.dataTables.min.js:82:388) 
    at r.h.fn.DataTable (http://192.168.33.10:5000/static/js/jquery.dataTables.min.js:166:245) 
    at HTMLDocument.<anonymous> (http://192.168.33.10:5000/static/test.html:30:45) 
    at j (http://192.168.33.10:5000/static/js/jquery-3.1.0.min.js:2:29568) 
    at k (http://192.168.33.10:5000/static/js/jquery-3.1.0.min.js:2:29882) undefined

источник

2016-09-21 shinkou

Насколько я знаю, блок, который вы прокомментировали, должен работать, и одна строка не должна работать. Если это наоборот, это ** Weird ** –

При вызове DataTables инициализатору без каких-либо опций, он ожидает заселена thead поэтому он может попытаться обнаружить столбцы и их атрибуты.

Добавьте как минимум один элемент <th> в ваш адрес, а затем прокомментированный код будет работать.

Неслучайная линия не действительно рабочая. В момент запуска javascript элемент еще не существует на странице! Таким образом, селектор захватывает 0 элементов и инициализатор на самом деле не работает, поэтому нет ошибки.

Альтернативно (и мой предпочтительный метод инициализации DT по большей части) ... дать вашему инициализатору массив определений столбцов.

$('#mytable').DataTable({ 
    columns: [{ title: 'First Name', data: 'FirstName' }] //etc, etc... 
})

источник

2016-09-21 14:25:32 BLSully

Может быть, вы правы ... Давайте подождем, пока OP –

столкнулся с этой проблемой ранее. да, вы правы, Инициализация таблицы без какой-либо колонки не должна работать ... Но вопрос по-прежнему остается тем же, почему работает одна строка! почему это не так. –

Я объяснил это в последнем абзаце моего ответа. Он/не работает/не работает, это просто не вызывает ошибки. JS работает до того, как элемент существует. Селектор выбирает нулевые элементы, поэтому инициализатор DataTable не запускается. Эрго, нет ошибки. – BLSully

Weird jQuery DataTables Инициализация Поведение

ответ

Смежные вопросы