I am seeking a solution for a specific functionality within the Knack platform, using the “Use a Filter Menu” option. I have perused both previous discussions and the tools provided by KTL, but I haven’t found a way to achieve exactly what I need.
My goal is that when applying a filter through the “Use a Filter Menu” option, the system should not only filter the table results according to the conditions I set in the filter, but also alter the table’s display.
Specifically, I want the system to hide all columns in the table, except for the first four and the column that shares the same name as the applied filter, upon the filter’s application. This way, only these selected columns will be displayed, allowing a more focused view of the filtered data.
I hope this clarifies my request. Any help or direction on how I could achieve this would be greatly appreciated.
Thank you very much for your response. I must admit, I’m not very familiar with JavaScript, so I’ve been reviewing the link you sent me and it seems to approach what I’m looking for. However, I would like to provide additional clarification to ensure my needs are completely understood.
I’ve attached an image to better illustrate my goal. I would like that when I click on ‘Col 1’ in the filter, the table only shows the columns ‘Data 1’, ‘Data 2’, ‘Data 3’, ‘Data 4’, and ‘Col 1’. If I click on ‘Col 2’ in the filter, then the columns displayed should be ‘Data 1’, ‘Data 2’, ‘Data 3’, ‘Data 4’, and ‘Col 2’. In short, I always want the first four columns (‘Data 1’, ‘Data 2’, ‘Data 3’, ‘Data 4’) to be displayed, and then, depending on the filter I select, I want only that additional column to be shown.
I hope this explanation helps you to better understand what I need. Any assistance in achieving this would be greatly appreciated.
I’m doing the same. I fix col1 , col2, col3 and col4 and when you filter using filter then col5 ,col6 etc start visible. Adjusted based on your requirement. check it now .
Previously it show all filters columns now it’s only show first 4 columns + 1 clicked columns(in filter)
First of all, I would like to express my gratitude for your help and dedication. Your guidance has been extremely valuable in this process.
After reviewing your code and exploring other examples in the forum, I have managed to adapt the solution to my specific requirements. Here I share my version of the code, in case it can be useful to you or other community members.
$(document).on(‘knack-view-render.view_x’, function (page) {
filterColumnsOnLoad();
$(‘.js-filter-menu.tabs ul li a’).click(function(ev) {
var cls = $(ev.currentTarget).find(‘span’).text();
setTimeout(function(){ filterColumns(cls); }, 1500);
});
});
function filterColumnsOnLoad() {
var cls = $(‘.js-filter-menu.tabs ul li.is-active a’).find(‘span’).text();
filterColumns(cls);
}
function filterColumns(cls) {
$(‘.kn-table.kn-table-table.knTable th:gt(3)’).each(function(index, elem) {
var columnName = $(elem).text().trim();
if (columnName !== cls) {
var colIndex = index + 5;
$(‘.kn-table.kn-table-table.knTable td:nth-child(’ + colIndex + ‘)’).hide();
$(‘.kn-table.kn-table-table.knTable th:nth-child(’ + colIndex + ‘)’).hide();
}
});
}
Again, many thanks for your support. It’s amazing to see how collaboration can drive progress and innovation.
