Skip to content

Instantly share code, notes, and snippets.

@csessig86
Last active December 10, 2015 14:28
Show Gist options
  • Save csessig86/4447512 to your computer and use it in GitHub Desktop.
Save csessig86/4447512 to your computer and use it in GitHub Desktop.
Simple DataTables template
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://wcfcourier.com/app/special/data_tables/media/css/demo_page.css">
<link rel="stylesheet" type="text/css" href="http://wcfcourier.com/app/special/data_tables/media/css/demo_table.css">
<style>
table {
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
float: left;
}
table th, table td {
text-align: center;
}
th, td {
padding-top: 10px;
padding-bottom: 10px;
font-size: 14px;
}
label {
width: 100%;
text-align: left;
}
table th {
font-weight: bold;
}
table thead th {
vertical-align: middle;
}
label, input, button, select, textarea {
line-height: 30px;
}
input, textarea, select, .uneditable-input {
height: 25px;
line-height: 25px;
}
select {
width: 100px;
}
.dataTables_length {
padding-left: 10px;
}
.dataTables_filter {
padding-right: 10px;
}
</style>
<script type="text/javascript" language="javascript" src="http://wcfcourier.com/app/special/data_tables/media/js/jquery.js"></script>
<script type="text/javascript" language="javascript" src="http://wcfcourier.com/app/special/data_tables/media/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#five_year').dataTable({
"iDisplayLength": 25
});
});
</script>
</head>
<body>
<--- Enter HTML table here --->
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment