From 3f18897ad2fe0069a8a7ef9a52ccdefb695bd992 Mon Sep 17 00:00:00 2001
From: Gertjan van den Burg <gertjanvandenburg@gmail.com>
Date: Wed, 5 Jun 2019 17:22:55 +0100
Subject: Add support for DataTables in admin view

---
 app/templates/admin/annotations.html | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

(limited to 'app/templates/admin/annotations.html')

diff --git a/app/templates/admin/annotations.html b/app/templates/admin/annotations.html
index 089de3b..bedf425 100644
--- a/app/templates/admin/annotations.html
+++ b/app/templates/admin/annotations.html
@@ -1,6 +1,11 @@
 {% extends "base.html" %}
 {% import 'bootstrap/wtf.html' as wtf %}
 
+{% block styles %}
+{{ super() }}
+<link rel="stylesheet" href="{{ bootstrap_find_resource('css/jquery.dataTables.css', cdn='datatables', use_minified=True) }}">
+{% endblock %}
+
 {% block app_content %}
 <h1>View Annotations</h1>
 <div class="row">
@@ -8,8 +13,9 @@
 		{{ wtf.quick_form(form) }}
 	</div>
 </div>
+<br>
 <article class="overview">
-	<table class="table table-striped">
+	<table id="annotations-table" class="table table-striped">
 		<thead class="thead-dark">
       <th scope="col">Dataset</th>
 			<th scope="col">Username</th>
@@ -26,3 +32,13 @@
 	</table>
 </article>
 {% endblock %}
+
+{% block scripts %}
+{{ super() }}
+<script src="{{ bootstrap_find_resource('js/jquery.dataTables.js', cdn='datatables', use_minified=True) }}"></script>
+<script>
+	$(document).ready(function() {
+		$('#annotations-table').DataTable();
+	});
+</script>
+{% endblock scripts %}
-- 
cgit v1.2.3