How do we filter data from renderd column also?

Aryan1703

Below here i am displaying mutliple columns data into one through render function but when i apply a custom search filter it only filters the data from the main column which in my case is leadLRV but does not consider the other rendered data. SO how do i search my value taking consideration of all the rendered column

This is how i have defined my column data

  {
                    data: "leadLRV",
                    class: "text-center",
                    render: function (data, type, row, meta) {
                        var leadLRV = row.leadLRV !== null ? row.leadLRV : '';
                        var midLRV = row.midLRV !== null ? row.midLRV : '';
                        var trailLRV = row.trailLRV !== null ? row.trailLRV : '';
                        var issueLRV = row.issueLRV !== null ? row.issueLRV : '';
                        var lrvNumbers = [leadLRV, midLRV, trailLRV];
                        var coloredLRVs = [];

                        lrvNumbers = lrvNumbers.map(function (lrv) {
                            return { value: lrv, isIssue: lrv === issueLRV };
                        });

                        lrvNumbers.sort(function (a, b) {
                            return a.value - b.value;
                        });

                        coloredLRVs = lrvNumbers.map(function (lrv) {
                            var lrvValue = lrv.isIssue ? '<span style="color: red;">' + lrv.value + '</span>' : lrv.value;
                            return lrvValue;
                        });
                        return coloredLRVs.join('<br>');
                    }
                },

And This is my search filter

 $('input', this.footer()).on('keyup change', function () {
                            if (that.search() !== this.value) {
                                that
                                    .search(this.value)
                                    .draw();
                            }
                        });

Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

allan

Kevin might be replying at the same time here, so apologies if our messages overlap, but I'd bet you are using server-side processing (serverSide)?

Client-side processing would use your returned colouredLRVs.join(...). Server-side processing however, will use the raw data in the database for the column (most likely - it depends entirely on the server-side script).

Allan

Aryan1703

Correct I am usign serverside script for this and sending the data individually. How can I send all this together as one so i can filter them

    Field::inst('A.dwgTag', 'leadLRV'),

    Field::inst('A1.dwgTag', 'midLRV'),

    Field::inst('A2.dwgTag', 'trailLRV'),

    Field::inst('A3.dwgTag', 'issueLRV'),

allan

Because the rendering and actual values the end user sees are computed on the client side, but the search is done on the server side (in SQL specifically), it isn't possible to do exactly what you are looking for I'm afraid.

I'm trying to think of there is a way to do it with a computed field in the db, but it gets really complicated.

I think, if you want this approach, you'd need to use client side processing. How many records are you working with?

Allan

Aryan1703

I am working with almost 20k records, so, If i go client-side processing it takes forever to load the page.Seems like need to change the filter for search.

kthorngren

Not sure if the server script is using an AND or OR search but possibly you can change the event handler to use columns().search() for the leadLRV column and supply the 4 column indexes in the API call.

Kevin

allan

Good point Kevin - since this is a global search, it does an OR across the columns. So what you could do is have the three other data points in hidden columns (columns.visible). They will still be searched, and since you are just displaying the raw data, that would have the same effect as if you were searching the combined value.

Allan