From 3e7210f66fb086ccba1d0a52a404633424b766e6 Mon Sep 17 00:00:00 2001
From: dcz2 <dcz@ipipan.waw.pl>
Date: Wed, 6 Jul 2022 23:05:12 +0200
Subject: [PATCH] Attempt to fix scroller in lists
---
entries/static/entries/js/entries.js | 18 +++++++++++-------
entries/templates/entries_base.html | 4 ++--
2 files changed, 13 insertions(+), 9 deletions(-)
diff --git a/entries/static/entries/js/entries.js b/entries/static/entries/js/entries.js
index d9ce5ac..8e25aa3 100644
--- a/entries/static/entries/js/entries.js
+++ b/entries/static/entries/js/entries.js
@@ -939,7 +939,7 @@ function setup_datatable(options) {
// load on scroll, requires paging set to true (default)
scroller: true,
paging: true,
- scrollY: $('#entries-list-div').height() - $('#entries-table_filter').outerHeight() - $('.dataTables_scrollHead').outerHeight() - $('#entries-table_info').outerHeight(),
+ scrollY: $(options.element).closest('#entries-list-div').height(),
serverSide: true,
ajax: {
url: options.url,
@@ -1010,6 +1010,8 @@ function setup_datatable(options) {
curr_entry = null;
+ window.adjust_heights();
+
return datatable;
}
@@ -1047,10 +1049,13 @@ function clear_entry() {
function adjust_heights() {
// TODO using css() here makes the table info disappear, strange!!!
- $('#entries-list-div').attr('style', 'max-height: ' + ($('#entries-list').height() - $('#filter-div').outerHeight()) + 'px;');
- $('#entryTabsContent').css('max-height', ($('#entry-display').height() - $('#entryTabs').outerHeight()) + 'px');
- var h = $('#entries-list-div').height() - $('#entries-table_filter').outerHeight() - $('.dataTables_scrollHead').outerHeight() - $('#entries-table_info').outerHeight();
- $('.dataTables_scrollBody').height(h).css('max-height', h + 'px');
+ $('.dataTables_wrapper').each(function () {
+ const $wrapper = $(this);
+ $wrapper.closest('#entries-list-div').attr('style', 'max-height: ' + ($wrapper.closest('#entries-list').height()) + 'px;');
+ // $('#entryTabsContent').css('max-height', ($('#entry-display').height() - $('#entryTabs').outerHeight()) + 'px');
+ var h = $wrapper.closest('#entries-list').height() - $('.dataTables_filter', $wrapper).outerHeight() - $('.dataTables_scrollHead', $wrapper).outerHeight() - $('.dataTables_info', $wrapper).outerHeight();
+ $('.dataTables_scrollBody').height(h).css('max-height', h);
+ });
}
function initialize_entries_list() {
@@ -1120,9 +1125,8 @@ $(document).ready(function() {
// gutterSize: 4,
// });
- adjust_heights();
-
$(window).resize(adjust_heights);
+ setInterval(adjust_heights, 1000);
bind_last_visited();
diff --git a/entries/templates/entries_base.html b/entries/templates/entries_base.html
index da1deaa..5642574 100644
--- a/entries/templates/entries_base.html
+++ b/entries/templates/entries_base.html
@@ -8,7 +8,7 @@
<!-- for autocomplete -->
<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<!-- https://datatables.net/ -->
- <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.10.22/sc-2.0.3/datatables.min.css"/>
+ <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs4/dt-1.12.1/sc-2.0.3/datatables.min.css"/>
<!--link rel="stylesheet" type="text/css" href="{% static 'entries/css/panels.css' %}"-->
<link rel="stylesheet" type="text/css" href="{% static 'entries/css/entries.css' %}">
<link rel="stylesheet" type="text/css" href="{% static 'common/css/role_colours.css' %}">
@@ -19,7 +19,7 @@
<!-- https://www.cssscript.com/split-view/ -->
<script src="https://unpkg.com/split.js/dist/split.min.js"></script>
<!-- https://datatables.net/ -->
- <script type="text/javascript" src="https://cdn.datatables.net/v/bs4/dt-1.10.22/sc-2.0.3/datatables.min.js"></script>
+ <script type="text/javascript" src="https://cdn.datatables.net/v/bs4/dt-1.12.1/sc-2.0.3/datatables.min.js"></script>
<script src="{% static 'common/js/csrf.js' %}"></script>
<!--script src="{% static 'entries/js/panels.js' %}"></script-->
<script src="{% static 'entries/js/forms.js' %}"></script>
--
GitLab