Tabulator: Ability to filter using another column of same row

Created on 10 May 2020  路  6Comments  路  Source: olifolkerd/tabulator

Hi Oli,

I could not find this ability anywhere(search stackoverflow & your documentation too). Therefore thought to request this as feature.

To have the ability to a computed/complex filtering based on data in other columns.
For example: in a row there is data
price = 10; col2 : 12; col3: 8; percent: 2;

How can i filter like this: (this word is just for example, i dont know what is best way)

table.addFilter("price", "<", this.col2);
table.addFilter("price", ">", this.col3*1.5); // to say must be greather than 50% of it

I did lookup the callback function but that is not for each record so that i cannot maipulate the data.
dataFiltering:function(filters){ }

Note: I will be able to do this using customFilter but i want to use the native functionality of Tabuator. Too keep my code clean and also to have code in alignment with your library.
Secondly i love the ease of filter that you have created(Awesome, so want to use it. like >=, in like etc).

I'm okay to have a workaround until you put this up. But as soon as it is delivered i will change.

For now my workaround: i have changed function
in function :: Filter.prototype.filterRow
at line 16839: update the foreach call as

self.filterList.forEach(function (filter) {
    if(filter.value.search('this')){
           filter.value = data[filter.value.replace('this.','')]  // new code
         }
    if (!self.filterRecurse(filter, data)) {
        match = false;
    }
});

calling it as table.setFilter("EMA50",'>','this.price')
If there is this. keyword then extract the data dynamically :)

using 4.6 version
Thanks,
OP

Question - Ask On Stack Overflow

All 6 comments

Just my suggestion: As per me the code change would be to add 4th param to tell if the supplied thing is a columnName instead of a value, so you can extract it. That way it wont destory current functionality & would add new functionality too.
table.addFilter("price", "<", col2,true)

update:: Ability to provide further complex computed filteration.
Note:: I might be doing it in wrong function too. So if there is any function called before this then let me know.

calling it as table.setFilter("EMA50",'>','this.price,*50*,this.price') . Seperator is , & resolver is this.

// updated filter to handle complex operations too
self.filterList.forEach(function (filter) {

    if(isNaN(filter.value) && filter.value.search('this.') > -1 ){
        var finalValue = '';
        var allValues = filter.value.split(',');
        for(var val in allValues){
            finalValue += eval("allValues[val].search('this.') > -1") ? eval("data[allValues[val].replace('this.','')]") : eval("allValues[val] ");
        }
        filter.value = eval(finalValue);
    }

    if (!self.filterRecurse(filter, data)) {
        match = false;
    }
});

Hey @prakash4mail

As you say, you can already do this with a custom filter function, the filter below checks two different columns on the same row


function customFilter(data, filterParams){
    //data - the data for the row being filtered
    //filterParams - params object passed to the filter

    return data.name == "bob" && data.height < filterParams.height; //must return a boolean, true if it passes the filter.
}

table.setFilter(customFilter, {height:3});

The whole point of the custom filters is that it allows users to add filters that are outside of the Tabulator scope to customise the table to meet their needs.

Im afraid that i would consider your usage case a bit of an edge case, and the proposed solution is a bit clunky, i would not be keen to have one argument mutate the purpose of another.

Im afraid i cant account for every single edge case in the code base otherwise the table would become very bloated and hard to use. But you are more than welcome to fork it and customise it for your own use case.

Thanks

Oli :)

Hi @olifolkerd
I would disagree on this one a bit. The ability to be able to use the same row in filteration should be there. Yes i agree it should not be for one row to another., that should be by customer.

Now in the above code that you gave. Imagine i want to filter stock market data and need to apply 10 filters, then it would be that i have to re-implement the code for > , <, in, like etc... Or is there a way i can use your api code(i beleive in the concept of not-reinventing the wheel). Besides based on the code that i saw in your code, it is fairly easy to do so.

On another side note, i wanted to say something/give feedback. Give a minute to read & understand it please(on my journey to selecting Tabulator over others). This is a view from customer perspective only, from someone who has tried 5 other libraries out there .:) & feedback to improve.

3 months ago i started looking up for a table library & used page https://bashooka.com/coding/javascript-data-table-libraries (not associated with it, just google'd) to browse. You know what, when i read the lines about Tabulator & saw your homepage, i left it(because the description looked like it is meant only for complex operations). But if you see the other ones like datatables, footable & fancygrid, their first example is the most simplest. Which made me feel that it would be easy to learn & do stuff easy(so i spend months on them). One day casually i opened your, but when i saw the code to do the things like grouping.... I'm telling you man, such complex things are also just a piece of few words of coding... 1000 times better than anything that i done with other.

Your api & code is Incredible!!!!!!!!!!!!!!!!

what made me miss this library is your homepage directly starting with a complex table. Can you please add another simplest table & 2 lines of how easy it is for a novice.(I'm telling you, we as customer would love it).

Thanks Oli for such a wonderful & clean & awesome plugin.
I have never said this but to you im saying, when my product goes successful , i will definetly Support you $$ 馃挴 %

Regards,
OP

Hey @prakash4mail

Thanks for your kind words, it is always great to hear that Tabulator is appreciated!

Also thanks for the feedback, i was aiming to show that Tabulator has a load of features on the home page but i can see how that might have put you off, i will look at adding a simple and complex example to the home screen to demonstrate both aspects.

Cheers

Oli :)

An update in the workaround (for anyone if uses my code). The code in the first post does not handles subFilters/Nested as i place that code in a wrong spot. Nested would be solved if code is moved to

line 16854 fun:: Filter.prototype.filterRecurse = function (filter, data)


Filter.prototype.filterRecurse = function (filter, data) {
    var self = this,
        match = false;

    if (Array.isArray(filter)) {
        filter.forEach(function (subFilter) {
            if (self.filterRecurse(subFilter, data)) {
                match = true;
            }
        });
    } else {
        // OP custom code: handle other columns filters in values
        if(filter.value && isNaN(filter.value) && !Array.isArray(filter.value) && filter.value.search('this.') > -1 ){
            var finalValue = '';
            var allValues = filter.value.split(',');
            for(var val in allValues){
                finalValue += eval("allValues[val].search('this.') > -1") ? eval("data[allValues[val].replace('this.','')]") : eval("allValues[val] ");
            }
            filter.value = eval(finalValue);
        }
        // EOF custom code
        match = filter.func(data);
    }

    return match;
};

By the way @olifolkerd So you have decided not to add this functionality(im guessing so as you have closed this thread. But i sugggest it would be great functionality).
You are the creator so you can take that decision. All im saying is think about it, its a good use case.

Was this page helpful?
0 / 5 - 0 ratings