При использовании list.js и tableop для сортируемой таблицы, взятой из Gdoc, я получаю сообщение об ошибке: «Uncaught TypeError: невозможно прочитать свойство« дочерниеNodes »неопределенного» в первой строке списка .js.Ошибка в таблице сортировки list.js
Поскольку веб-сайт, на котором я работаю, может загружать только JS, мне нужно написать весь мой html с помощью js или jquery, так что это немного неудобно. Я думаю, что ошибка возникает из-за того, что у меня есть все, но я пробовал перемещать вещи безрезультатно. Все работает, кроме сортировки.
Спасибо!
HTML файл
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<script type="text/javascript" src="list.js-master/dist/list.min.js"></script>
<script type="text/javascript" src="src/tabletop.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<div id="tablesetter"></div>
</body>
<script type="text/javascript">
var url = 'url to gdoc here';
$(document).ready(function(){
Tabletop.init({key: url, callback: showInfo, parseNumbers: true})})
function showInfo(data, tabletop){
$("#tablesetter").append('<h2>Table Working</h2><table><thead><th class="sort" data-sort="university">University</th><th class="sort" data-sort="no">Billionaires</th><th class="sort" data-sort="no2">Billionaires Rank</th><th class="sort" data-sort="rank">U.S. News Rank</th></thead><tbody class="list"></tbody></table>');
$.each(tabletop.sheets("Sheet1").all(), function(i, cat){
var htmltable = $('<tr><td class="university">' + cat.university + '</td>');
htmltable.append('<td class="no">' + cat.numberofbillionaires + '</td>');
htmltable.append('<td class="no2">' + cat.rankedbybillionaires + '</td>');
htmltable.append('<td class="rank">' + cat.usnewsranking + '</td></tr>');
htmltable.appendTo("tbody");
})
}
</script>
<script type="text/javascript" src="options.js"></script>
</html>
JS файл
var options = {
valueNames: [ 'university', 'no' , 'no2' , 'rank']
};
var userList = new List('tablesetter', options);