Merge pull request #2524 from pallets-eco/fix/bs4-filter-changes

Fix `Apply` filter button show/hide

doc/changelog.rst

@@ -1,6 +1,13 @@
 Changelog
 =========
 
+2.0.0a1
+-------
+
+Fixes:
+
+* The `Apply` button for filters will show/hide correctly again
+
 2.0.0a0
 -------
 

flask_admin/static/admin/js/bs4_filters.js

@@ -22,11 +22,10 @@ var AdminFilters = function(element, filtersElement, filterGroups, activeFilters
     function removeFilter() {
         $(this).closest('tr').remove();
         if($('.filters tr').length == 0) {
-            $('button', $root).hide();
-            $('a[class=btn]', $root).hide();
+            $('button', $root).addClass('d-none');
             $('.filters tbody').remove();
         } else {
-            $('button', $root).show();
+            $('button', $root).removeClass('d-none');
         }
 
         return false;
@@ -42,7 +41,7 @@ var AdminFilters = function(element, filtersElement, filterGroups, activeFilters
         var $field = createFilterInput($inputContainer, null, selectedFilter);
         styleFilterInput(selectedFilter, $field);
 
-        $('button', $root).show();
+        $('button', $root).removeClass('d-none');
     }
 
     // generate HTML for filter input - allows changing filter input type to one with options or tags
@@ -69,6 +68,11 @@ var AdminFilters = function(element, filtersElement, filterGroups, activeFilters
         }
         inputContainer.replaceWith($('<td/>').append($field));
 
+        // show "Apply Filter" button when filter input is changed
+        $field.on('input change', function() {
+            $('button', $root).removeClass('d-none');
+        });
+
         return $field;
     }
 
@@ -153,7 +157,7 @@ var AdminFilters = function(element, filtersElement, filterGroups, activeFilters
 
         addFilter(name, filterGroups[name], false, null);
 
-        $('button', $root).show();
+        $('button', $root).removeClass('d-none');
     });
 
     // on page load - add active filters
@@ -166,7 +170,7 @@ var AdminFilters = function(element, filtersElement, filterGroups, activeFilters
 
     // show "Apply Filter" button when filter input is changed
     $('.filter-val', $root).on('input change', function() {
-        $('button', $root).show();
+        $('button', $root).removeClass('d-none');
     });
 
     $('.remove-filter', $root).click(removeFilter);

flask_admin/templates/bootstrap4/admin/model/layout.html

@@ -46,7 +46,7 @@
             <input type="hidden" name="page_size" value="{{ page_size }}">
         {% endif %}
         <div class="pull-right">
-            <button type="submit" class="btn btn-primary" class="d-none">{{ _gettext('Apply') }}</button>
+            <button type="submit" class="btn btn-primary d-none">{{ _gettext('Apply') }}</button>
             {% if active_filters %}
                 <a href="{{ clear_search_url }}" class="btn btn-secondary">{{ _gettext('Reset Filters') }}</a>
             {% endif %}