KNACK Suggested Code - Hide empty table code is also hiding table with filters that has records on it

Help Center Get Answers
1

I tried knack recommended code for hiding tables with empty records. However, when using applied it, I noticed that even tables with records on it were hided only because I'm using filters and the first one did not showed results. How can I change the code in order to avoid it?

/* HIDE EMPTY TABLE - Change the scene_1 to the scene key of your choice, or replace with any to work on all pages. */
$(document).on('knack-scene-render.any', function(event, scene) {
// Loop through each scene view, on the page.
scene.views.map(function(view) {
// If view has row data and that data is less than 1...
if(Knack.models[view.key].data && Knack.models[view.key].data.length < 1) {
// Remove the specific view.
$('#' + view.key).remove();
}
});
});

2

Hi,

 

So i'm also running into this problem. How can i fix this. Is it maybe possible to have some code that only hides certain views instead of all views on a certain page?

3

I ran into a similar problem. First I'll describe what I was trying to do, and then at bottom I'll describe how I solved it.

Intended Outcome

I have a page that contains 5 Views, each of which are Lists/Tables. Each List displays a specific data type, all of which have a field called "Status", which is set to either "New" or "Old". Each List also has pre-set filters that allow users to view either "New" data, "Old" data, or "All" data. On pageload, the filters should be set to "New". Any Lists that do not have any data should not display. Users should also have the option to change the status of a piece of data to New or to Old.

The Problem

Like Guil and Tony, I used the prefab JS script that removes any tables that do not have results. However, because my tables are set to show "New" data first, this means that any Tables that don't have New content do not display. I dug through the Knack object in the JS console and tried to find an alternate solution, but wasn't able to find any references to the total amount of results for a table (only to the results of the table according to the current filter). Since I want the filters to initially only show "New" data, simply changing their order wouldn't solve my problem.

For what it's worth, view.attributes.menu_filters returns an array of the different filters that apply to a view, but nowhere in there is something like array[i].length that I could use to create exceptions. So I came up with a different work-around:

A Solution

First, I changed the order of my filters. Instead of displaying "New" first, and running the risk of having 0 results and a removed Table, I made the first filter "All". Then I wrote a script that, when the scene renders, selects the final filter for all filter menus on the page. I of course moved "New" over to be the final filter (which made this next bit of code easier to write).

Changing the status of data on my page to "New" or to "Old" also caused the knack-scene-render.scene_73 event listener to re-fire, which was removing my tables if I was, for example, using the "New" filter and clicked to change the status of the last piece of new data to "Old." So I also turned off the scene-render listeners for this page. They seem to re-initialize when you load a new page, so no harm no foul.

$(document).on('knack-scene-render.scene_73', function() { //run the code only when this specific scene loads
	var allFilters = document.getElementsByClassName("js-filter-menu"); //find all filter menus on page
	for (var i = allFilters.length - 1; i >= 0; i--) { //for each filter menu,
		allFilters[i].firstChild.lastChild.firstChild.click(); //go to the list of filters, take the last filter, and click on it 
	}
	$(document).off('knack-scene-render.scene_73'); //disable the table-removing event listener (while on this page)
});

If you use the code, don't forget to change the scene number in the first and last line to be the correct scene for your app.

I hope this is helpful! It's a bit of a work-around, and my JS certainly isn't perfectly optimized, but it does the trick for now.

4

Hi Guilherme - would you mind reaching out to us at support@knack.com on this?

Tony and I worked through his set up yesterday and found it was the Page Rules on his page that was negatively affecting the code. We've updated the developer documentation on the "Hide Empty Tables" to account for this scenario.

We'd like to take a look at your specific scenario as well and see if there's any other updates we need to make. You can also grab our updated code from the above URL and see if that addresses your issue.

Thanks!

5

The code does not work i'm finding out why i'll post back when i find out