diff options
| -rw-r--r-- | html/stats.jinja2 | 31 |
1 files changed, 31 insertions, 0 deletions
diff --git a/html/stats.jinja2 b/html/stats.jinja2 index 98d8474..482a2cf 100644 --- a/html/stats.jinja2 +++ b/html/stats.jinja2 @@ -8,6 +8,13 @@ <link href="https://www.gentoo.org/assets/css/leaflet.css" rel="stylesheet" media="screen"> <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.10.21/b-1.6.2/b-colvis-1.6.2/b-print-1.6.2/rg-1.1.2/datatables.min.css"/> <link rel="icon" href="https://www.gentoo.org/favicon.ico" type="image/x-icon"> + <style> + .filter-button, .filter-button:hover { + color: #495057; + background-color: #fff; + border: 1px solid #ced4da; + } + </style> </head> <body> @@ -345,6 +352,7 @@ ], "initComplete": function( settings, json ) { setTimeout(function(){ + $('#table_id_length').prepend("<button onclick='addFilters();' class='btn btn-outline-secondary filter-button btn-sm mr-4'>Toggle Filters</button>"); table.buttons().container().prependTo($('#table_id_length')); $('#table_id_length').prepend("<span class='mr-1'> Show </span>"); document.getElementsByClassName("buttons-colvis")[0].classList = "custom-select custom-select-sm form-control form-control-sm mr-4"; @@ -353,6 +361,29 @@ }); } ); + function addFilters(){ + + if($("#filterRow").length) { + $("#filterRow").remove(); + }else{ + $('#table_id thead tr').clone(true).appendTo('#table_id thead'); + $('#table_id thead tr:eq(1)').attr("id", "filterRow"); + $('#table_id thead tr:eq(1) th').each(function (i) { + var title = $(this).text(); + $(this).html('<input type="text" placeholder="Search ' + title + '" />'); + + $('input', this).on('keyup change', function () { + if (table.column(i).search() !== this.value) { + table + .column(i) + .search(this.value) + .draw(); + } + }); + }); + } + } + </script> </body> |