Result limit in filter_by_value dropdown menu

Tags: #<Tag:0x00007efc644336d8>

Hi,

We’ve had a report from a customer that the checklist displayed in the dropdown menu when the filter_by_value option is incomplete, and only displays the first eight values. This is reproducible in a test page using the latest CDN version of handsontable, although in my testing nine values are available rather than eight.

I don’t see anything in the documentation indicating how many values should be expected in this case, although there does seem to be sufficient scrolling vertical space reserved to fit a larger number of rows, giving the impression that more values should be visible than actually are.

The forum topic doesn’t seem to allow upload of text files, but the issue is reproducible with the table’s default settings for the filter dropdown menu options as below:

const hot = new Handsontable(document.getElementById("hotcontainer1"), {
	data: [
		['r1c1', 'r1c2'],
		['r2c1', 'r2c2'],
		['r3c1', 'r3c2'],
		['r4c1', 'r4c2'],
		['r5c1', 'r5c2'],
		['r6c1', 'r6c2'],
		['r7c1', 'r7c2'],
		['r8c1', 'r8c2'],
		['r9c1', 'r9c2'],
		['r10c1', 'r10c2'],
		['r11c1', 'r11c2'],
		['r12c1', 'r12c2']
	],
	height: 'auto',
	colHeaders: true,
	rowHeaders: true,
	filters: true,
	dropdownMenu: {
		items: {
			'---------': {},
			"filter_by_condition": {},
			"filter_operators": {},
			"filter_by_value": {},
			"filter_action_bar": {}

		}
	},
	colWidths: 100,
	licenseKey: 'non-commercial-and-evaluation'
});

Select the dropdown for the first column, and choose ‘is equal to’ as the filter condition. The checklist in the ‘filter by value’ section will contain the following values:

r10c1, r11c1, r12c1, r1c1, r2c1, r3c1, r4c1, r5c1, r6c1

With values r7c1, r8c1, r9c1 missing. The values are available if the search box is used, and a realistically sized data set would have too many values for the full listing to be usable, so I don’t consider this to be a real problem. It would, however, be helpful for customer support purposes to know what the expected maximum number of values is in this case.

The customer also has some confusion about using the filter by condition in conjunction with filter by value. The filter is technically working correctly if I understand correctly, but the UI is a bit counterintuitive. Their expectation seems to be that if the ‘equal to’ option is selected, but no value entered, that whatever values are selected in the filter by value checklist would be displayed in the table. Instead, there are no results.

The behavior makes sense in a way since the effective filter is (value = ‘’ and (value=“checked item 1” or value=“checked Item 2”)), which would result in zero matches. The interface is somewhat misleading here due to the ‘filter by value’ section of the dropdown not being displayed until after a ‘filter by condition’ option has been selected. Since the customer did not enter an actual condition, they have an expectation that the values selected in the checklist would be the ones displayed in the table.

The confusion seems to be because the checklist is not displayed until an option is selected in the ‘filter by condition’ select box. If the list was already displayed when the condition type was set to ‘none’, then the filter by value list would better match the user expectation in this case, which is that they would be able to select which values to display using the checkboxes. Using the filter by condition in conjunction with the checkbox list with an ‘and’ condition is somewhat redundant as it requires that the values the user wishes to display be effectively selected twice, once in the filter condition and again in the checklist.

Another way to clarify this would be to make the filter by value options one of the condition types. The existing filter by condition input has limited utility since it is only usable for a single value. If the existing ‘filter by value’ was available as one of the condition types, maybe labelled as “within” or something similar to imply that it is a set selection, then it would be more obvious to a user that the set of selected values is one of the filter constraints. A user then could have the option to specify this first, allowing them to select a set of values without necessarily needing to worry about any equals/contains/etc conditions, then choose to add a set of and/or conditions to change that result if they need to.

Hi @brian.bogovich

Thank you for very in-depth description of the issues.

Regarding the first one. This is actually a bug, and it appear when the filter_by_condition option is preceded by the separator. When we skipped the separator all of the values are visible, like in this example:

https://jsfiddle.net/aszymanski/8m260dba/

This issue is also reported here: https://github.com/handsontable/handsontable/issues/9222

If I understand correctly, removing the separator solves the second issue also, am I right?

Hi Adrian,

Thanks for your quick feedback!

In the jsfiddle example, I added a second copy of the table similar to the one in our app, and it appears to work correctly just by removing the separator.

In the actual application, where we have the freeze/unfreeze columns options first, followed by a separator, and then the filters, the problem would still occur after the separator was removed. It works correctly if there are no items at all before the filtering options. I was able to resolve it in the app by moving the separator below the filtering options, and then the frozen columns after that.

The problem, then, appears to not be specifically with the separator line, but more of a general issue with the menu ordering.

Thanks for your support!