Skip to content

Instantly share code, notes, and snippets.

@dkirkham

dkirkham/missing_rows.html

Created August 9, 2019 11:53
Show Gist options
  • Save dkirkham/a71976de86cef95c756533443d85e022 to your computer and use it in GitHub Desktop.
Save dkirkham/a71976de86cef95c756533443d85e022 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
missing_rows.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Table Demo</title>
<!-- Tell the browser to be responsive to screen width -->
<!-- Tabulator Table -->
<link rel="stylesheet" href="https://unpkg.com/tabulator-tables@4.3.0/dist/css/tabulator.min.css">
<script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.3.0/dist/js/tabulator.min.js"></script>
</head>
<body>
<div>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Main content -->
<section class="content container-fluid">
<div id="table-ro"></div>
</section>
<!-- /.content -->
</div>
</div>
<!-- ./wrapper -->
<script type="text/javascript">
var tableData = [
{id:1, column1:"Row 1", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:2, column1:"Row 2", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:3, column1:"Row 3", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:4, column1:"Row 4", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:5, column1:"Row 5", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:6, column1:"Row 6", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:7, column1:"Row 7", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:8, column1:"Row 8", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:9, column1:"Row 9", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:10, column1:"Row 10", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:11, column1:"Row 11", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:12, column1:"Row 12", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:13, column1:"Row 13", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:14, column1:"Row 14", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:15, column1:"Row 15", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:16, column1:"Row 16", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:17, column1:"Row 17", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:18, column1:"Row 18", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:19, column1:"Row 19", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:20, column1:"Row 20", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:21, column1:"Row 21", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:22, column1:"Row 22", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:23, column1:"Row 23", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:24, column1:"Row 24", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:25, column1:"Row 25", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:26, column1:"Row 26", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:27, column1:"Row 27", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:28, column1:"Row 28", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:29, column1:"Row 29", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:30, column1:"Row 30", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:31, column1:"Row 31", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:32, column1:"Row 32", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:33, column1:"Row 33", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:34, column1:"Row 34", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:35, column1:"Row 35", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:36, column1:"Row 36", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:37, column1:"Row 37", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:38, column1:"Row 38", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:39, column1:"Row 39", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:40, column1:"Row 40", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:41, column1:"Row 41", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:42, column1:"Row 42", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:43, column1:"Row 43", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:44, column1:"Row 44", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:45, column1:"Row 45", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:46, column1:"Row 46", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:47, column1:"Row 47", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:48, column1:"Row 48", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:49, column1:"Row 49", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:50, column1:"Row 50", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:51, column1:"Row 51", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:52, column1:"Row 52", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:53, column1:"Row 53", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:54, column1:"Row 54", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:55, column1:"Row 55", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:56, column1:"Row 56", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:57, column1:"Row 57", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:58, column1:"Row 58", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:59, column1:"Row 59", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:60, column1:"Row 60", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:61, column1:"Row 61", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:62, column1:"Row 62", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:63, column1:"Row 63", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:64, column1:"Row 64", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:65, column1:"Row 65", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:66, column1:"Row 66", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:67, column1:"Row 67", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:68, column1:"Row 68", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:69, column1:"Row 69", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
{id:70, column1:"Row 70", column2:"Data 2", column3:"Data 3", column4:"Data 4", column5:"Data 5", column6:6, column7:"Data 7", column8:"Data 8"},
]
var table = new Tabulator("#table-ro", {
data:tableData,
height:"500px",
responsiveLayout:"hide",
layout:"fitColumns",
columns:[
{title:"Column 1", field:"column1", width:125, align:"left", responsive:2},
{title:"Column 2", field:"column2", width:88, align:"left", responsive:2},
{title:"Column 3", field:"column3", width:112, align:"left", responsive:0},
{title:"Column 4", field:"column4", width:88, align:"left", responsive:0},
{title:"Column 5", field:"column5", width:112, align:"left", responsive:0},
{title:"Column 6", field:"column6", width:74, align:"left", responsive:1},
{title:"Column 7", field:"column7", width:88, align:"left", responsive:0},
{title:"Column 8", field:"column8", align:"left", responsive:0},
],
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment