From 811e32a693bc87e713290703e5d0a5e1b36f51df Mon Sep 17 00:00:00 2001
From: Samuel Van Campenhout <162597817+SamuelVch98@users.noreply.github.com>
Date: Mon, 29 Jul 2024 09:42:26 +0200
Subject: [PATCH] Filter on column table (#11)
* Creation of a filter by column for the table of users and courses + refactor to avoid redundancy
---
static/scripts/util.js | 23 +++++++++++++++++++++++
templates/courses.html | 17 +++++++++++++++++
templates/home.html | 1 +
templates/users.html | 29 +++++++++++++++++++++++++++++
4 files changed, 70 insertions(+)
diff --git a/static/scripts/util.js b/static/scripts/util.js
index 6856b2e..c039e24 100644
--- a/static/scripts/util.js
+++ b/static/scripts/util.js
@@ -105,4 +105,27 @@ $(document).on('click', '.remove-tag', function (e) {
$(this).parent('.badge').remove();
});
+$(document).on('click', '#filterIcon', function (e) {
+ e.preventDefault();
+ $('#filterRow').toggle();
+});
+
+$(document).on('keyup', '#filterRow input', function () {
+ // Get the index of the column from the data-column attribute of the input
+ let column = $(this).data('column');
+
+ // Get the value entered in the input and convert it to lowercase
+ let value = $(this).val().toLowerCase();
+ // Iterate through each row in the table body
+ $('table tbody tr').each(function () {
+ // Get the text content of the cell at the specified column index and convert it to lowercase
+ let cellText = $(this).find('td').eq(column).text().toLowerCase();
+
+ // Check if the cell text contains the searched value
+ let containsValue = cellText.indexOf(value) > -1;
+
+ // Show or hide the row based on whether the cell text contains the searched value
+ $(this).toggle(containsValue);
+ });
+});
\ No newline at end of file
diff --git a/templates/courses.html b/templates/courses.html
index d37d526..386cb99 100644
--- a/templates/courses.html
+++ b/templates/courses.html
@@ -13,8 +13,23 @@
List of Courses
{% include 'filter.html' %}
+
+
{% endblock %}
{% block additionalfooter %}